简体   繁体   English

AngularJs指令一种数据绑定无效的方式

[英]AngularJs directive one way data binding not working

I want to use one way data binding from controller to my directive, but I get undefined instead of real value. 我想使用一种方法将数据从控制器绑定到我的指令,但是我得到的是undefined而不是真实的值。

Here is definition of directive scope 这是指令scope定义

scope: {
    eventAdmin: '@',
    eventId: '@'
  }

Here is how I use directive. 这是我使用指令的方式。

<directive event-admin="{{eventAdmin}}" event-id="{{eventId}}"></directive>

And here is my link function 这是我的link功能

function directiveLink (scope, element, attrs) {
console.log(scope.eventId); //-> undefined

} }

If the directive's name is "directive" and the containing controller's scope has the properties "eventAdmin" and "eventId" then this should be working. 如果指令的名称为“ directive”,并且包含控制器的作用域具有“ eventAdmin”和“ eventId”属性,则该指令应起作用。

I made a JSFiddle of your example: https://jsfiddle.net/Royar/qu55ujj5/4/ 我为您的示例做了一个JSFiddle: https ://jsfiddle.net/Royar/qu55ujj5/4/

HTML: HTML:

<div ng-app="myApp" ng-controller="myCtrl">
  <directive event-admin="{{eventAdmin}}" event-id="{{eventId}}"></directive>
</div>

JS: JS:

var myApp = angular.module('myApp', []);
angular.module("myApp").controller("myCtrl", function($scope) {
  $scope.eventAdmin = "aaa";
  $scope.eventId = "bbb";

});
angular.module("myApp").directive("directive", function() {
  return {
    scope: {
      eventAdmin: "@",
      eventId: "@"
    },
    template: "{{eventAdmin}}",
    link: function(scope, element, attrs) {
      console.log(scope.eventAdmin); //working
    }
  };
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM