AngularJs指令单向数据绑定不起作用

AngularJs directive one way data binding not working

本文关键字：数据绑定 不起作用 指令 AngularJs      更新时间：2023-09-26

我想使用从控制器到指令的单向数据绑定，但我得到的是undefined，而不是实际值。

以下是指令scope 的定义

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

以下是我如何使用指令。

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

这是我的link函数

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

}

如果指令的名称是"directive"，并且包含控制器的作用域具有属性"eventAdmin"answers"eventId"，那么这应该可以工作。

我用你的例子做了一个JSFiddle：https://jsfiddle.net/Royar/qu55ujj5/4/

HTML:

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

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
    }
  };
});
相关文章：