欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳解AngularJS controller調(diào)用factory

 更新時(shí)間：2017年05月19日 11:16:54   作者：KingCruel  
本篇文章主要介紹了詳解AngularJS controller調(diào)用factory，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

1、定義 factory.js 文件

var appFactorys = angular.module('starter.factorys', []) 
appFactorys.factory('HouseFactory', function () { 
  var houseList = [ 
    { id: 0, title: '急售北二環(huán) 小區(qū)配套齊全 精裝修', price: '88.0', describe: '2室1廳 120平米', img: 'img/ben.png' }, 
    { id: 1, title: '急售東二環(huán) 小區(qū)配套齊全 精裝修', price: '88.0', describe: '2室1廳 120平米', img: 'img/max.png' }, 
    { id: 2, title: '急售南二環(huán) 小區(qū)配套齊全 精裝修', price: '87.0', describe: '2室1廳 120平米', img: 'img/adam.jpg' }, 
    { id: 3, title: '急售西二環(huán) 小區(qū)配套齊全 精裝修', price: '86.0', describe: '2室1廳 120平米', img: 'img/perry.png' }, 
    { id: 4, title: '急售北二環(huán) 小區(qū)配套齊全 精裝修', price: '85.0', describe: '2室1廳 120平米', img: 'img/mike.png' } 
  ]; 
  return { 
      all: function () { 
        return houseList; 
      }, 
    }; 
});

2、在 app.js 文件引用 factory.js 文件

復(fù)制代碼 代碼如下:

angular.module('starter', ['ionic', 'ngCordova', 'starter.directives','starter.factorys','starter.services', 'starter.customControllers']) 

3、在controller中調(diào)用factory

appControllers.controller('HouseCtrl', function ($scope, $timeout, $ionicModal, $ionicActionSheet, $http, $cordovaToast, $ionicLoading, HouseFactory) { 
  // $scope.houseList = [ 
  //   { id: 0, title: '急售北二環(huán) 小區(qū)配套齊全 精裝修', price: '88.0', describe: '2室1廳 120平米', img: 'img/ben.png' }, 
  //   { id: 1, title: '急售東二環(huán) 小區(qū)配套齊全 精裝修', price: '88.0', describe: '2室1廳 120平米', img: 'img/max.png' }, 
  //   { id: 2, title: '急售南二環(huán) 小區(qū)配套齊全 精裝修', price: '87.0', describe: '2室1廳 120平米', img: 'img/adam.jpg' }, 
  //   { id: 3, title: '急售西二環(huán) 小區(qū)配套齊全 精裝修', price: '86.0', describe: '2室1廳 120平米', img: 'img/perry.png' }, 
  //   { id: 4, title: '急售北二環(huán) 小區(qū)配套齊全 精裝修', price: '85.0', describe: '2室1廳 120平米', img: 'img/mike.png' } 
  // ]; 
 
  /* 調(diào)用Factory.js數(shù)據(jù) */ 
  $scope.houseList = HouseFactory.all(); 
 
})

4、html頁(yè)面調(diào)用

<ion-list> 
  <ion-item class="item item-thumbnail-left" ng-repeat="item in houseList" href="#/housedetail/{{item.id}}" rel="external nofollow" style="padding--bottom:2px"> 
    <img ng-src="{{item.img}}"> 
    <h2>{{item.title}}</h2> 
    <dd class="assertive cus-price">{{item.price}}萬(wàn)元</dd> 
    <dd class="u-f-h4">{{item.describe}}</dd> 
  </ion-item> 
</ion-list>

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

  • 利用Angularjs實(shí)現(xiàn)幻燈片效果

    利用Angularjs實(shí)現(xiàn)幻燈片效果

    AngularJS是Google開(kāi)發(fā)的純客戶端JavaScript技術(shù)的WEB框架,用于擴(kuò)展、增強(qiáng)HTML功能,它專為構(gòu)建強(qiáng)大的WEB應(yīng)用而設(shè)計(jì)。下面這篇文章我們來(lái)分享如何利用Angularjs實(shí)現(xiàn)幻燈片效果。
    2016-09-09
  • angular動(dòng)態(tài)表單制作

    angular動(dòng)態(tài)表單制作

    通過(guò)實(shí)例代碼給大家詳細(xì)講述了angular動(dòng)態(tài)表單的制作方法，對(duì)此有需要的朋友參考下。
    2018-02-02
  • 詳解angularjs popup-table 彈出框表格指令

    詳解angularjs popup-table 彈出框表格指令

    本篇文章主要介紹了angularjs popup-table 彈出框表格指令，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-09-09
  • angular select 默認(rèn)值設(shè)置方法

    angular select 默認(rèn)值設(shè)置方法

    下面小編就為大家?guī)?lái)一篇angular select 默認(rèn)值設(shè)置方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-06-06
  • angular+bootstrap的雙向數(shù)據(jù)綁定實(shí)例

    angular+bootstrap的雙向數(shù)據(jù)綁定實(shí)例

    本篇文章主要介紹angular+bootstrap的雙向數(shù)據(jù)綁定的實(shí)例，具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
    2017-03-03
  • 詳解為生產(chǎn)環(huán)境編譯Angular2應(yīng)用的方法

    詳解為生產(chǎn)環(huán)境編譯Angular2應(yīng)用的方法

    這篇文章主要介紹了詳解為生產(chǎn)環(huán)境編譯Angular2應(yīng)用的方法,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-12-12
  • AngularJS自動(dòng)表單驗(yàn)證

    AngularJS自動(dòng)表單驗(yàn)證

    這篇文章主要介紹了AngularJS手動(dòng)表單驗(yàn)證的相關(guān)資料，AngularJS的表單驗(yàn)證大致有兩種，一種是手動(dòng)驗(yàn)證，一種是自動(dòng)驗(yàn)證，本文重點(diǎn)介紹AngularJS自動(dòng)表單驗(yàn)證，感興趣的小伙伴們可以參考一下
    2016-02-02

    • 最新評(píng)論