【问题标题】:Using ng-repeat in md-autocomplete to display auto suggestion and popular products在 md-autocomplete 中使用 ng-repeat 显示自动建议和热门产品
【发布时间】:2017-06-15 06:34:08
【问题描述】:

我正在尝试使用角度材料md-autocomplete 指令来显示两种不同的东西,一种是流行产品,另一种是自动建议,但您只能使用一种md-item 进行迭代,所以我决定使用ng-repeat。我在从getSuggestion() 函数返回的数组上使用了三个循环,该数组本身包含两个数组:流行产品对象数组和建议对象数组。 问题是,现在当我使用向上和向下键选择一个项目时,它选择的是项目列表而不是单个项目,当我单击特定项目时,我在搜索框中得到类似 [object Object],[object Object],[object Object],[objct Object],[object Object],[object Object] 的内容而不是像我使用 md-item 遍历流行产品或建议数组时得到的项目字符串。

我的数据是这样的:

Object {popular_products: Array[3], suggestion: Array[0], cat_suggestion: Array[0]}

这是我在控制器中的代码:

$scope.getSuggestions = function(query) { 
    $scope.query = query;
    return $http.get(url + "?q=" + $scope.query + "&ssize=6&psize=3")
        .then(function(response) {
            if (typeof response.data === 'object') {
              console.log(response.data);
              //return $q.resolve(response.data)
              return $q.resolve([response.data.suggestion, response.data.popular_products]);
            } else {
                return $q.reject(response.data); // invalid response
        }, function(response) {
            return $q.reject(response.data); // Error
        });

};

这是我的看法:

<md-autocomplete
    md-no-cache="true"
    md-search-text= "query"
    md-items="sugg in getSuggestions(query)"
    md-item-text="sugg.suggestion"
    md-delay="0"
    md-min-length="1"
    placeholder="Search">
   <md-item-template>
        <div ng-if="$index == 0">
            <div ng-value="item.suggestion" ng-repeat="item in sugg">{{item.suggestion}}</div> 
        </div>
        <div ng-if="$index==1">
            <span>
                <b>Popular products:</b>
                <div ng-value="pp.price" ng-repeat="pp in sugg ">
                    {{pp.price}}
                </div>
            </span>
        </div>
    </md-item-template>
</md-autocomplete>

当我将鼠标悬停在建议上时会发生这种情况,它会突出显示建议列表而不是单个建议:

这导致了:

【问题讨论】:

    标签: angularjs md-autocomplete


    【解决方案1】:

    问题出在这里

    return $q.resolve([response.data.suggestion, response.data.popular_products])
    

    尝试

    return $q.resolve(response.data.suggestion.concat(response.data.popular_products))
    

    因为你有[[],[]]所以它会导致问题

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-02-27
      • 1970-01-01
      • 1970-01-01
      • 2019-11-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多