javascript - How to write angular custom instructions-PHP Tutorial-php.cn

javascript - How to write angular custom instructions

WBOY

Release： 2016-07-06 13:51:35

Original

846 people have browsed it

Now I have three similar pieces of code like this

<code>       <input  type="radio" name="a" ng-value="planStatuse.id" ng-model="planStatus.status" ng-click="planStatusChange()">
       <span>{{planStatuse.name}}</span></code>

Copy after login

<code>                <input type="radio" ng-value="{{_appType.id}}" ng-model="appType.val" name="app">
                <span>{{_appType.name}}</span></code>

Copy after login

<code>                <input type="radio"  name="center" ng-model="pageType" ng-value="centerPage.id" ng-click="changePage(pageType)">
                <span>{{centerPage.name}}</span></code>

Copy after login

I want to write these three pieces of code into a custom instruction. However, some of the above codes have events, some do not, and the events are different. How should I write them?

var eInput= angular.module("eInput", []);
eInput.directive('eInput',function(){

<code>return {
    restrict: "A",
    template:' <div ng-repeat="inputList in inputListes track by $index" class="planlist">'+
   ' <input  type="radio" name="a" ng-value="inputList.id" ng-model="inputList.status" ng-click="planStatusChange($index)">'+
    '<span>{{inputList.name}}</span>'+
'</div>',
    replace:true,
    scope:{
        inputListes:'='
    }
}
</code>

Copy after login

});

Reply content:

Now I have three similar pieces of code like this

<code>       <input  type="radio" name="a" ng-value="planStatuse.id" ng-model="planStatus.status" ng-click="planStatusChange()">
       <span>{{planStatuse.name}}</span></code>

Copy after login

<code>                <input type="radio" ng-value="{{_appType.id}}" ng-model="appType.val" name="app">
                <span>{{_appType.name}}</span></code>

Copy after login

<code>                <input type="radio"  name="center" ng-model="pageType" ng-value="centerPage.id" ng-click="changePage(pageType)">
                <span>{{centerPage.name}}</span></code>

Copy after login

I want to write these three pieces of code into a custom instruction. However, some of the above codes have events, some do not, and the events are different. How should I write them?

var eInput= angular.module("eInput", []);
eInput.directive('eInput',function(){

<code>return {
    restrict: "A",
    template:' <div ng-repeat="inputList in inputListes track by $index" class="planlist">'+
   ' <input  type="radio" name="a" ng-value="inputList.id" ng-model="inputList.status" ng-click="planStatusChange($index)">'+
    '<span>{{inputList.name}}</span>'+
'</div>',
    replace:true,
    scope:{
        inputListes:'='
    }
}
</code>

Copy after login

});

Please confirm whether each function you want to execute is in the controller scope