php - Angular 从 php url 获取的数据填充自动完成字段

Question

我正在使用一个自动完成字段，该字段需要根据 php (YII2) 操作从 mysql 数据库中获取要列出的数据。目前，自动完成字段是静态填充的。下面给出了用于填充自动完成字段的代码。

app.controller('DemoCtrl', DemoCtrl);

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

    // list of `state` value/display objects
    self.states = loadAll();
    self.selectedItem = null;
    self.searchText = null;
    self.querySearch = querySearch;

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

    /**
     * Search for states... use $timeout to simulate
     * remote dataservice call.
     */
    function querySearch(query) {
        var results = query ? self.states.filter(createFilterFor(query)) : self.states;
        var deferred = $q.defer();
        $timeout(function () {
            deferred.resolve(results);
        }, Math.random() * 1000, false);
        return deferred.promise;
    }

    /**
     * Build `states` list of key/value pairs
     */
    function loadAll() {
        var allStates = 'Alabama, Alaska, Arizona, Arkansas, California, Colorado, Connecticut, Delaware,\
              Florida, Georgia, Hawaii, Idaho, Illinois, Indiana, Iowa, Kansas, Kentucky, Louisiana,\
              Maine, Maryland, Massachusetts, Michigan, Minnesota, Mississippi, Missouri, Montana,\
              Nebraska, Nevada, New Hampshire, New Jersey, New Mexico, New York, North Carolina,\
              North Dakota, Ohio, Oklahoma, Oregon, Pennsylvania, Rhode Island, South Carolina,\
              South Dakota, Tennessee, Texas, Utah, Vermont, Virginia, Washington, West Virginia,\
              Wisconsin, Wyoming';

        return allStates.split(/, +/g).map(function (state) {
            return {
                value: state.toLowerCase(),
                display: state
            };
        });
    }

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

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

    }
}

在函数 loadall() 中，我需要从数据库中获取值，该值是从 YII2 Controller 操作返回的。可以通过 url 访问它我的 Controller 操作如下所示

public function actionGetAllPackages()
{
    $packages = \common\models\Packages::find()
            ->select('name')
            ->all();
    $name = "";
    foreach ($packages as $package)
    {
        $name = $name.', '.$package->name;
  }
     $name = substr($name, 2);
    echo addslashes($name);
}

如何将 Controller Action 打印的值转换为 Angular 函数？请帮忙 。我是第一次使用 YII2 和 Angular。

提前致谢

Answer 1

只需在脚本的 loadAll() 方法中对 Controller 中的 GetAllPackages() 函数调用 $http 请求，并将该值分配给 所有州。