2013-09-18 2 views
0

Я начинающий программист, пытающийся собрать веб-приложение с угловым и узлом. Я пытаюсь включить угловой ui modal, но с проблемами. Модальное окно при загрузке, кажется, отображает html с главной страницы, а не из html из шаблона. Однако, как указано ниже, шаблон загружается на страницу.Что может быть причиной этой нечетной угловой ui модальной проблемы?

То, что я ищу, не обязательно является ответом на то, что здесь происходит не так (хотя это было бы замечательно), а скорее советы по устранению неполадок, чтобы попытаться определить проблему, не прибегая к stackoverflow для ответа в будущем ,

Скриншот выпуска: screenshot

Узел консоли:

node console

Ниже мой текущий код:

Родительские и дочерние контроллеры (addContent и newTerms соответственно):

angular.module('myApp.controllers', []). 
controller('addContent', function ($scope, $http, $modal, $log){ 


$scope.items = ['item1', 'item2', 'item3']; 

$scope.addTerm = function() { 
    var newTerm = $modal.open({ 
     templateUrl: '../../views/partials/newTermModal.jade', 
     controller: 'newTerms', 
     resolve: { 
      items: function() { 
       return $scope.items; 
      } 
     } 
    }); 

    newTerm.result.then(function (selectedItem) { 
     $scope.selected = selectedItem; 
    }, function() { 
     $log.info('Modal dismissed at: ' + new Date()); 
    }); 
}; 

}). 

controller("newTerms",function($scope, $modalInstance, items){ 

$scope.items = items; 
$scope.selected = { 
    item: $scope.items[0] 
}; 

$scope.ok = function() { 
    $modalInstance.close($scope.selected.item); 
}; 

$scope.cancel = function() { 
    $modalInstance.dismiss('cancel'); 
}; 

}); 

Я думал, может быть, это была проблема с путём к шаблону - должен ли путь быть относительно того, где находится файл контроллера? Вот как у меня сейчас. Большое спасибо!

ответ

2

Ваш код контроллера выглядит нормально, я также подозреваю, что это проблема с путём к шаблону.

Я лично не имел никакого успеха ссылаясь на расположение файла шаблона в templateUrl, как вы это делаете. То, что я обычно делаю вместо этого добавить ng-include в нижней части моей страницы:

<div ng-include src="'../../views/partials/newTermModal.jade'"></div> 

Я не знаком с нефритом, но предполагается, что ваш угловой шаблон structered следующим образом:

<script type="text/ng-template" id="newTermModal.jade"> 
</script> 

Затем установите templateUrl к только id углового шаблона:

templateUrl: 'newTermModal.jade' 

для устранения проблем, я бы проверить консоль и осмотреть от newTermModal.jade и убедитесь, что это то, что вы ожидаете.

+0

Где вы храните скрипт? На странице html, на которой будет отображаться модальный? В идеале (и, как я уже сейчас), я хотел бы иметь отдельный файл html/jade для него. Джейд - шаблонный язык - я думал, что попробую, потому что он использовался в угловом/экспресс-приложении. Спасибо за вашу помощь! – bornytm

+0

Да, так внизу страницы, отображающей модальный, поместите ng-include, который ссылается на путь файла к отдельному файлу шаблона html/jade. – kmdsax

+0

Хм, у меня проблемы с обработкой ссылки ng-include. Каким должен быть путь? – bornytm

0

Я наткнулся на тот же вопрос, но по несколько иной причине. В моем случае templateurl не был установлен на правильный путь. Это означает, что всякий раз, когда либо templateurl не найден, либо не является допустимым HTML (jade недействителен HTML - он скомпилирован в допустимый HTML с помощью предварительных процессоров), тогда угловая просто использует родительскую html-страницу (т.е. страницу откуда модаль вызывается от).

Смежные вопросы