Передача объекта в директиву через атрибут и содержащая переменная

Question

Передача объекта в директиву через атрибут и содержащая переменная

0

Я хочу передать $scope.data для директивы через свой атрибут в объекте, могу ли я получить ниже формат с любым решением, но не через отдельный атрибут?

<custom-directive detail="{index:1, data: {{data}}}">
</custom-directive>

И область действия указана ниже в директиве

scope: {detail: "="}

zhiyishou 01 дек. 2015, в 09:24

Источник

Теги:

javascript

angularjs

angularjs-directive

3 ответа

Ещё вопросы

Thibault Linglain · Answer 1 · 2015-12-01T07-08-00.000Z

У вас все еще есть решение создать свой объект в контроллере:

$scope.detail = {index:1, data:$scope.data};

и привести его в свою директиву:

<custom-directive detail="detail"></custom-directive>

Bilal · Answer 2 · 2015-12-01T06-07-00.000Z

Одним из решений может быть

return {
      restrict: 'E',
      require: 'ngModel',
      scope: {
        model: '=ngModel',
      },
      link: function(scope, element, attributes, ngModel) {
           if (!ngModel) {
              return;
           }

           console.log(scope.model); // your passed data
      }
}

а потом

<custom-directive ngModel="data"></custom-directive>

Теперь у вас будет ваша $scope.data переданная директиве внутри scope.model. Но учтите, что любое изменение scope.model в директиве будет отражено в $scope.data тоже.

Чтобы этого избежать, вы можете просто изменить ngModel.

return {
          restrict: 'E',
          scope: {
            data: '=myData',
          },
          link: function(scope, element, attributes) {

               console.log(scope.data); // your passed data
          }
    }

а потом

<custom-directive my-data="data"></custom-directive>

Jay Shukla · Answer 3 · 2015-12-01T05-37-00.000Z

Вы просто записываете данные только в свой объект, он автоматически будет устранен с вашего контроллера. Сделайте следующее:

HTML

<custom-directive detail="{index:1, data: data}">
</custom-directive>

директива

myApp.directive('customDirective', function() {
   return {
       restrict:"AE",
    scope:{
        detail:"="
    },
    link:function(scope,ele,attrs) {
        alert(JSON.stringify(scope.detail));
    }
   }
});

Демо-версия скрипта

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