web-dev-qa-db-ja.com

AngularJSはディレクティブテンプレートの$ rootScope変数を評価します

入力フィールドを作成するディレクティブがあります。この入力フィールドのng-model属性を$ rootScope変数の値に設定する必要があります。この背後にある理由は、入力フィールドをレイアウトに配置し、どのページがロードされるかに応じて異なるモデルにバインドすることです。このグローバル変数を各コントローラーに設定し、ディレクティブでそれにアクセスすると思いました。

ATM変数はハードコードされています

App.run(function($rootScope){
    $rootScope.mymodel = 'search.name';
})

そして指令

Directives.directive('inputFilter', function(){
    return{
        restrict: 'E',
        replace:true,
        controller: function($scope, $rootScope){
            console.log($scope.mymodel);
            console.log($rootScope.mymodel)

        },
        template: '<input class="filter" type="text" ng-model="mymodel" placeholder="Nach filtern">'
    }

});

次のようにレンダリングされます

<input class="filter ng-pristine ng-valid" type="text" ng-model="mymodel" placeholder="Filter">

入力フィールド内のテキストは、mymodel変数の値です。 console.logは

search.name
search.name

誰かがこの問題についていくつかの光を当てていただけませんか？

angularjsangularjs-directiveangularjs-scope
12
glasspill

あなたが望むのは

template: '<input class="filter" type="text" ng-model="' 
  + $rootScope.mymodel + '" placeholder="Nach filtern">'

フィドル 。

$rootScopeをディレクティブに挿入する必要があることに注意してください：

Directives.directive('inputFilter', function($rootScope) {
13
Mark Rajcok