2017-05-22 1 views
0

Dies ist ein kleines Stück Code, der von mir geschrieben wurde und dachte, kann es einige einen helfen, die für eine ähnliche Funktionalität suchen:Angular JS - benutzerdefinierte Richtlinie mit ul-li-Elemente wie Radio-Buttons und Checkboxen

benutzerdefinierte Richtlinien über Li-Elemente - Anklicken auf das sie/abwählen des Li-Element auszuwählen die ausgewählten Objekte in einem Array und Ausbeuten (unter Controller gesammelt werden)

<div ng-app="myApp" ng-controller="myCtrl"> 

    <ul> 
    <li> 
     <input type="text" ng-model="search_ms.title" /> 
    </li> 
    <li 
    ng-repeat="x in items | filter:search_ms" 
    multi-select multi-select-item="x" 
    ng-class="{selected:x.checked}" 
    ng-click="getAllSelectedItems(items)"> 
     {{x.title}} --> {{x.checked}} 
    </li> 
    </ul> 

    <ul> 
    <li> 
     <input type="text" ng-model="search_ss.title" /> 
    </li> 
    <li 
    ng-repeat="x in items_ | filter:search_ss" 
    single-select 
    single-select-item="x" 
    unselect-all-items="items_" 
    ng-class="{selected:x.checked}" 
    ng-click="getAllSelectedItems(items_)"> 
     {{x.title}} --> {{x.checked}} 
    </li> 
    </ul> 

<div class="clearfloat"> 
</div> 


    <br/> 
    <br/> 
    <br/> 

    <p> 
    {{selectedItems}} 
    </p> 

    <br/> 
    <br/> 
    <br/> 

    <p> 
    {{unselectedItems}} 
    </p> 

JS Fiddle: http://jsfiddle.net/AjayBunga/NBhn4/230/

Sowohl einzelne Auswahl (wie Radios) als auch Mehrfachauswahl (wie Kontrollkästchen) wurde implementiert. Bitte schlagen Sie vor, ob ich irgendeinen Code optimieren kann oder ob dies auf viel einfachere Art und Weise geschehen kann, da ich neu bei eckigen Anweisungen bin.

Vielen Dank im Voraus.

Antwort

0

anstelle der Verwendung ng klicken und mit einem Timeout die Änderungen erfasst

diese Antwort hat mir geholfen, eine dircetive Callback-Funktion

AngularJS Directive Callback

in schriftlicher Form
Verwandte Themen