2016-03-01 122 views
1

好的,第一個問題如此..請親切..功能啓動后角模塊注入模塊

我正在使用Angular的Material框架進行Angular Autofill輸入。

我需要用來自ajax調用的數據填充它。 (即一個國家的arrey) 我最初的做法是將模塊注入到應用程序的控制器中,然後當ajax調用返回成功時,我只會觸發它的函數。

這樣做效果不好,因爲在數據返回並在檢查時崩潰之前它會加載一次(從注入)。

採取兩個:添加一個空數據檢查導致它加載和停止按預期,然後當數據來(最終)模塊削減他們在單個項目,並準備好,但頁面不會工作。通過不會工作我的意思是,它不會自動建議,因爲你鍵入..

我認爲我需要模塊加載,而不是內部功能,但我似乎無法做到這一點..這就是我需要幫助。 。

添加代碼:

angular.module("Myapp", ['ngMaterial', 'Autofill-country' ]) 
.controller("mycontroller", ["$scope", "$http", function ($scope, $http) { 

    //automatic suggest 
    automaticsuggest() 
    function automaticsuggest() { 
    suggesturl = 'http://www.mysuggest_front_services' 
    $http({ 
     method: 'GET', 
     url: suggesturl, 
     responseType: "json", 
     async: false // Just tried that to see if it works.. I am not really fond of it 
    }).then(function (response) { 
     countriesarrey = response.data.Countries 

     // .run('Autofill-country', ['Autofill-country']) - Tried this too.. 
     country(); // this is the function of the autosuggest. 
Once checked with breakpoints it does get the array and cut it and filter it etc, but the n when you input something in the input field.. It doesnt suggest..    
    }); 

    } 

而自動完成模塊

angular.module('Autofill-country', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache']) 
    .controller('country', country); 

function country($timeout, $q) { 
var self = this; 


if (countriesarrey == "undefined" || countriesarrey == null) { } 
else { countrys(); } 
// list of `country` value/display objects 

function countrys() { 

    self.countries = loadAll(); 
    self.selectedItem = null; 
    self.searchTextcountry = null; 
    self.querySearch = querySearch; 

    // ****************************** 
    // Internal methods 
    // ****************************** 

    /** 
    * Search for countries... use $timeout to simulate 
    * remote dataservice call. 
    */ 
    function querySearch(query) { 
     var results = query ? self.countries.filter(createFilterFor(query)) : []; 
     return results; 
    } 

    /** 
    * Build `countries` list of key/value pairs 
    */ 

    function loadAll() { 
     var allcountries = countriesarrey; 
     console.log(countriesarrey); 
     return allcountries.split(/, +/g).map(function (country) { 
      return { 
       value: country.toLowerCase(), 
       display: country 
      }; 
     }); 
    } 

    /** 
    * Create filter function for a query string 
    */ 
    function createFilterFor(query) { 
     var lowercaseQuery = angular.lowercase(query); 

     return function filterFn(country) { 
      return (country.value.indexOf(lowercaseQuery) === 0); 
     }; 

    } 
} 
} 

回答

1

你應該創建一些工廠來獲取你的數據,這將有一個實現方法具d,答覆答覆。承諾解決後,您可以按照您所需的方式獲取所獲取的數據。

var myApp = angular.module('myApp', []); 

myApp.factory('myFactory', function($http, $q, $timeout) { 
    return { 
     getData: function() { 
      // return $http.get(...); 
     }, 
    }; 
}); 

myApp.controller('MyCtrl', function(myFactory) { 
    this.getData = function() { 
     myFactory.getData().then(function(response) { 
      // use response.data here 
     }) 
    } 
}) 

見琴:http://jsfiddle.net/jcpmsuxj/44/

+0

我還沒有還沒有完全嘗試過,但它看起來真的答應(荷蘭國際集團)。 (我想每個人都有免費的雙關語),我正在嘗試它。非常感謝你! –