Angular 在函数启动后注入模块

Question

好的，第一个问题所以..客气点..

我正在使用 Angular 的 Material 框架制作此 Angular 自动填充输入。

我需要用来自 ajax 调用的数据填充它。（即国家阵列）我最初的方法是将模块注入到应用程序的控制器中，然后当 ajax 调用 returns 成功时，我将触发它的功能。

效果不佳，因为它在数据返回之前加载一次（从注入中）并在检查时崩溃。

取二：添加对空数据的检查导致它按预期加载和停止，然后当数据到来时（最终）模块将它们切割成单独的项目并准备就绪，但页面无法工作。不会工作我的意思是它不会在您键入时自动建议..

我认为我需要加载模块而不是其中的函数，但我似乎无法做到这一点..这就是我需要帮助的原因..

添加代码：

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);
        };

    }
 }
}

Answer 1

你应该创建一些工厂来获取你的数据，这将有一个方法，返回承诺。承诺将解决后，您可以对获取的数据执行任何操作。

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
        })
    }
})

参见fiddle：http://jsfiddle.net/jcpmsuxj/44/

Angular 在函数启动后注入模块

Angular inject a module after a function starts

javascript

ajax

jquery

inject

angularjs