0

私はAngularJSで新しく、ディレクティブのものと少し混乱しています。 以下のコードでは、アウトソースモジュールにあるディレクティブで入力フィールドを作成し、カスタムディレクティブでそれに焦点を当てる必要があります。
...anglejsのメインモジュールからモジュールの後にディレクティブをトリガーする方法

myHtml.html

<body ng-app="main" ng-controller="myCtrl"> 
    <my-field></my-field> 
</body> 

Outsource.js

var app2 = angular.module('pain', []); 
app2.directive('myField', [function() { 
    return { 
     scope.f = 'focus-me'; 
    }, 
    template: 'name: <input type="text" class="{{f}}"/>' + 
     '<br/>' + 
     'input class is: \"{{f}}\"' 
} 
}]); 

myApp.js

私はアウトソースモジュールを変更することはできませんように注意してください
var app1 = angular.module('main', ['pain']); 
app1.controller('myCtrl', ['$scope', function($scope) { 
    $scope.state = true; 
}]); 
app1.directive('focusMe', ['$timeout', '$parse', function($timeout, $parse) { 
    return { 
     restrict: 'C', 
     link: function(scope, element) { 
      scope.$watch(scope.state, function() { 
       console.log('value=', scope.state); 
       if (scope.state === true) { 
        $timeout(function() { 
         element[0].focus(); 
        }, 20); 
       } 
      }); 
     } 
    }; 
}]); 

フィドル
fiddler

なお、以下に、このようなコードでOKでしょうが、私はアウトソースコードを変更することはできません。
それはあなたがよっぽどあなたが仕事にやりたいことのためにOutsource.jsにコードを修正する必要が
fiddler

答えて

0

動作します。それにはいくつか問題があります。説明のために私のコメントをチェックアウト:

Outsource.js - それはあなたの質問にあるよう

var app2 = angular.module('pain', []); 
app2.directive('myField', [function() { 
    return { 
     /* directive scope needs to be added as a parameter to the angular directive link function before you can use it. */ 
     scope.f = 'focus-me'; 
    }, 
    // Your template property should be in your return object 
template: 'name: <input type="text" class="{{f}}"/>' + 
     '<br/>' + 
     'input class is: \"{{f}}\"' 
} 
}]); 

Outsource.js - それは

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

app2.directive('myField', function() { 
    return { 
    restrict: 'E', 
    template: 'name: <input type="text" class="{{f}}"/>'+ 
      '<br/>'+ 
      'input class is: \"{{f}}\"', 
    link: function (scope) { 
      scope.f='focus-me'; 
    }, 

    controller: [function ($scope) { 
     // Do Awesome stuff in/with $scope here 
    }] 
    }; 
}); 

だから人を教えてどうあるべきかOutsource.jsにコードを書いてそれを修正しなければ、達成したいことを達成できません。

関連する問題