Click the LI label in Angular to change the core code of the color

Click the LI label after NG-REPEAT traversed to achieve the Border color;

HTML code:

JS code:

$ scope.li_click = function (i) {$ scope.focus = i;};
1 In the

element, “Li_Click () method added to the SCOPE object is executed; 2 will” $ INDEX (line number value) “in this method As the actual paragraph to the method, the “FOCUS” attribute value is set to “$ index” value;

3 Therefore, when you click a row

  • element, the “FOCUS” attribute value will become corresponding “$ Index”;

    At this time, “NG-Class” style instructions of the

    element specifies the style that the element needs to be added via the Key / Value object, since the

    element is clicked When the “$ index” variable value and “FOCUS” attribute value are the same, that is, the return value of “$ index == focus” is true;

  • 5 At this point you should understand, “NG-Class “The style command value is changed to” focus “;

  • 6 After the above analysis and operation, we have achieved the effect of border when clicking
  • elements.

    CSS style:

  • ul .focus {border: 1px solid blue;}

      The above is a small-knit to the Angular to click the LI tag to achieve changes in the color, I hope to help everyone. If everyone has any questions, please leave a message, the small package will reply to everyone in time. Thank you very much for your support of Tumi Cloud Website!  
    © Copyright Notice
    Just support it if you like
  • comment Grab the couch

    Please log in to comment