在指令控制器中用HTML定义的get指令属性

时间:2015-05-26 09:11:21

标签: angularjs angular-directive

我正在创建一个自定义控制器,我想在控制器中获取指令属性。这是我到目前为止所做的,但我无法获得属性值。

HTML代码:

<my-text name="tester"></my-text>

角色代码:

app.directive('MyText', function() {
   var controller = ['$scope', function ($scope) {
        console.log($scope.name)
        $scope.text = $scope.name
      }];
  return {
    restrict: 'EA',
    scope: {
      name: '='
    },
    controller: controller,
    template: 'Name: {$ text $}'
  };
});

你可以看到我在HTML name中定义了一个属性值tester我想在指令控制器中获取此值,以便我可以对此进行一些计算并在{{1 }。它只是我试图做的一个演示,但最后我会向后端发送$ http请求(POST中的属性值)并在模板HTML中显示响应。

有什么建议我错了吗?

注意:我在angular中使用这个template语法,因为我覆盖了角度默认语法,因为我使用Python / Django作为后端,两者都有类似的语法

1 个答案:

答案 0 :(得分:0)

以下是演示plunker

您应该像这样更新您的指令:

app.directive('myText', function(){
  return {
    restrict: 'AE',
    scope: {
      name: '='
    },
    controller: function($scope, $element, $attrs){
      console.log($attrs.name)
      $scope.text = $attrs.name;
    },
    template: 'Name: {{text}}'
  };
});