2017-08-14 5 views
1

私のシナリオでは、私はディレクティブを持っています。ディレクティブはスコープパラメータとして別のディレクティブタグを持っています。最初のディレクティブは新しいディレクティブを生成し、その中にディレクティブを追加する必要があります。新しく生成されたディレクティブに動的双方向バインド属性を追加する必要もあります。AngularJSカスタム生成ディレクティブ動的アトリビュートバインディング

新しいディレクティブタグを生成できますが、ディレクティブ属性を追加しようとすると、これが文字列(値または単純文字列)として追加されます。 したがって、私が新しくディレクティブでスコープ変数として属性にアクセスしようとすると、それは私に 'undefined'を与えます。

HTML:

<div ng-controller="MainCtrl"> 
=== 
<directive1 tag="obj.tag" request-id="requestId"></directive1> 
</div> 

が指令:

app.directive('directive1', function($compile) { 
return { 
    restrict: 'E', 
    scope:{ 
     tag:"=", 
     requestId:"=" 
    }, 
    link: function(scope, element, attrs) { 
     var el; 
     scope.$watch('tag', function (tpl) { 
      console.log("8888",tpl); 
      el = $compile(tpl)(scope); 
      el.attr('request-id', scope.requestId); 
      el = $compile(el)(scope); 
      element.append(el); 
     }); 
     // attrs.$set('ngHide', false); 
     // attrs.$set('hide', null); 
     // $compile(element)(scope); 
    } 
}; 
}) 
app.directive('test', function($compile) { 

    return { 
     restrict: 'E', 
     scope:{ 
      requestId:"=" 
     }, 
     controllerAs: 'requestCtrl', 
     bindToController: true, //required in 1.3+ with controllerAs 

     controller:function(){ 
      var requestCtrl=this; 
      console.log("----->>>> ",requestCtrl.requestId) 
     }, 
     link: function(scope, element, attrs) { 
     } 
    }; 
}); 

コントローラー:

app.controller('MainCtrl', function($scope) { 
    $scope.obj={}; 
    $scope.obj.tag="<test></test>"; 
    $scope.requestId="123"; 
}); 

ここでは、あなたのplunkerは角1.0を使用しているplunker

答えて

1

です.2はまだbindToControllerをサポートしていません。1.3に変更すると、あなたの質問に記述されているように文字列バインディングとして機能します。

requestIdを2ウェイバインドとして使用するには、文字列requestIdをattrに渡す必要があります。

el.attr('request-id', 'requestId'); 

Working plunker

関連する問題