Question

在我的角度指令中使用templateUrl时，我会遇到一些奇怪的行为。

基本上，当我提供templateUrl时，我似乎无法从链接函数或指令控制器访问已评估的属性。 link函数只返回未评估的表达式（例如{{input.text}}），控制器获取undefined。

使用小提琴进行演示比解释更容易，所以我创建了一个非常简单的示例 here 。打开控制台＆amp;记下输出，然后注释掉templateUrl属性并重新运行小提琴以查看差异。请注意，如果将模板移出缓存并进入template属性，则不会发生这种情况。有人可以解释提供templateUrl更改导致此行为的原因吗？

为了完整性，这里是代码：

HTML：

<div ng-controller="MyCtrl">
    Text1<input ng-model="input.text"/>
    <div d-nested="" d-attr2="{{input.text}}"></div>
</div>

JS：

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.input = {};
    $scope.input.text = "some string";
}

myApp.run(['$templateCache', function($templateCache) {
  return $templateCache.put('/partials/rhombus.html', 
                            '<span>Just a template.</span>');

myApp.directive('dNested', function(){
    return {
        transclude: false,
        //Comment out the below line to observe the difference.
        templateUrl: '/partials/rhombus.html',
        replace: false,
        controller: function($attrs, $scope){
            this.logAttr = function(){
                console.log("from controller: " + $attrs.dAttr2);
            }
        },
        link: function(scope, element, attrs, ctrl){
            attrs.$observe('dAttr2', function(val){
                console.log("from link function: " + val);
                ctrl.logAttr();               
            });
        }
    }
});

更新

在下面的马丁得到一个有用的答案之后，我看到它现在正在工作，但是当指令嵌套时（即一个被转换到另一个指令中）。请参阅updated fiddle here。您仍会注意到注释掉模板网址会导致正确的行为。

Answer 1

这似乎是你正在使用的Angular版本中的一个错误（小提琴使用1.0.1）。如果升级到1.0.5或更高版本，它可以正常工作。

提供templateUrl使得无法在指令的控制器中获取属性值

1 个答案: