angularjs1.5 組件內(nèi)用函數(shù)向外傳值的實(shí)例
組件:
.component('homeCityListCom',{ bindings: { list: '<', cityname:'&' }, controllerAs: 'vm', template: ` <div class="cityListBox"> <span class="title">按拼音首字母選擇</span> <div class="cityItem flexRowStart" ng-repeat="x in vm.list track by $index"> <p class="zimu flexColumnCenter">{{x.sortName}}</p> <ul class="flexRowStart city"> <li ng-repeat="c in x.cities"><a href="/#!/home?city_id={{c.cityId}}" rel="external nofollow" ng-click="vm.cityname({name: c.cityName})">{{c.cityName}}</a></li> </ul> </div> </div>` })
控制器:
.controller('cityListCtrl', ['$scope','$http', function ($scope,$http) { let that = this; // 將城市名字存在本地 that.cityName = function(name){ console.log(123); localStorage.setItem('cityName', name); } }])
使用組件:
<home-city-list-com list="cl.cityList" cityname="cl.cityName(name)"></home-city-list-com>
路由設(shè)置:
.state('city_list',{ url:"/city_list", templateUrl:'templates/indexTpl/city_list.html', controllerAs:'cl', controller:'cityListCtrl' })
以上這篇angularjs1.5 組件內(nèi)用函數(shù)向外傳值的實(shí)例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
詳解angular2如何手動點(diǎn)擊特定元素上的點(diǎn)擊事件
這篇文章主要介紹了詳解angular2如何手動點(diǎn)擊特定元素上的點(diǎn)擊事件,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-10-10angular4自定義表單控件[(ngModel)]的實(shí)現(xiàn)
這篇文章主要介紹了angular4自定義表單控件[(ngModel)]的實(shí)現(xiàn),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-11-11基于AngularJs select綁定數(shù)字類型的問題
今天小編就為大家分享一篇基于AngularJs select綁定數(shù)字類型的問題,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10實(shí)例詳解angularjs和ajax的結(jié)合使用
本篇文章給大家介紹angularjs和ajax的結(jié)合使用,本文介紹的非常詳細(xì),對angularjs和ajax感興趣的朋友一起參考下吧2015-10-10Angular 4依賴注入學(xué)習(xí)教程之組件服務(wù)注入(二)
大家都知道依賴注入式AngularJS的重要特性之一,之前我們已經(jīng)介紹了關(guān)于Angular 4依賴注入基礎(chǔ)的內(nèi)容,下面這篇文章主要給大家介紹了關(guān)于Angular 4依賴注入之組件服務(wù)注入的相關(guān)資料,需要的朋友可以參考借鑒,下面來一起看看吧。2017-06-06實(shí)例剖析AngularJS框架中數(shù)據(jù)的雙向綁定運(yùn)用
這篇文章主要介紹了AngularJS框架中數(shù)據(jù)的雙向綁定運(yùn)用實(shí)例,包括數(shù)據(jù)綁定中的關(guān)鍵函數(shù)與監(jiān)聽器觸發(fā)的相關(guān)講解,需要的朋友可以參考下2016-03-03angularjs實(shí)現(xiàn)多選框分段全選效果實(shí)現(xiàn)
這篇文章主要為大家介紹了angularjs實(shí)現(xiàn)多選框分段全選效果實(shí)現(xiàn)詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06教你用AngularJS框架一行JS代碼實(shí)現(xiàn)控件驗(yàn)證效果
簡單來說Angular.js是google開發(fā)者設(shè)計(jì)和開發(fā)的一套前端開發(fā)框架,幫助你簡化前端開發(fā)的負(fù)擔(dān)。到底能簡化到什么程度呢,今天我們來看下,一行代碼實(shí)現(xiàn)控件驗(yàn)證效果,有木有嚇尿?2014-06-06