После моих исследований я узнал, что мне нужно использовать изолированные области, чтобы достичь моей цели. Позвольте мне дать вам небольшую схему, как мое приложение работает сейчас.
У меня есть веб-сервис, написанный на ASP.NET. Я получаю данные в JSON, используя jQuery.ajax, завернутый в функцию:
function getData(id) {
var params = { "PlannerId": id };
jQuery.ajax({
type: "POST",
url: "Default.aspx/getData",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(params),
dataType: "json",
traditional: true,
async: false,
success: function (msg) {
$scope.allSeminars = allSeminars.concat(msg.d.SeminarDays);
}
});
return $scope.allSeminars;
}
Функция помещается в контроллер, чтобы сказать "dataController".
Обычно для отображения моей директивы один раз. Я вызываю свою функцию (также в моем контроллере) с некоторым "id", который я получаю от динамического ввода.
getData(jQuery('div[display-data]').parent().find('input').val());
а затем вызывать директиву:
<div display-data></div>
и он работает для одной информации и одной директивы.
Теперь я хочу дважды отобразить свою директиву на моей веб-странице с разными данными в каждом.
Я добавил выделенную область действия в свою директиву:
rfg.directive("displayData", ['someService', function (someService) {
return {
restrict: "A",
scope: {
seminar: '=sem'
},
templateUrl: '../../template.tpl.html',
controller: 'dataController',
Теперь я показываю свою директиву следующим образом:
<div display-data sem="sem0"></div><br>
<div display-data sem="sem1"></div>
И мой контроллер выглядит так:
var semId = jQuery('div[display-data]');
$scope.sem0 = getData(jQuery(semId[0]).parent().find('input').val());
$scope.sem1 = getData(jQuery(semId[1]).parent().find('input').val());
Я также попытался добавить "семинар" (тот, который указан в области действия) в ng-repeat в моем шаблоне, но без успеха.
Имеет ли какой-либо вопрос о том, что я делаю неправильно, а также о том, как я могу заменить данные из.ajax по-разному, чем вызов функции, отвечающей за это непосредственно с контроллера.
Спасибо!
Я думаю, что ваша логика неверна, вы не должны использовать jQuery с AngularJS.
Вы можете заменить jQuery.ajax()
на $http
или ngRessource
→ https://docs.angularjs.org/api/ng/service/$http
→ https://docs.angularjs.org/api/ngResource
Вместо выполнения этого jQuery(semId[0]).parent().find('input').val()
использовать ng-model
→ https://docs.angularjs.org/api/ng/directive/ngModel
При этом вы можете начать с хорошей основы.