Home >Backend Development >PHP Tutorial >javascript - How to write angular custom instructions

javascript - How to write angular custom instructions

WBOY
WBOYOriginal
2016-07-06 13:51:35836browse

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>

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

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


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>

});

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>

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

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


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>

});

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

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn