Question

我想制作一个自定义类型头Angular Bootstrap UI，这是我的自定义模板：

<script type="text/ng-template" id="customTemplateall.html">
       <a>
          <span ng-bind-html="match.label | uibTypeaheadHighlight:query"></span>
          <br>
          <small>Nama Lain:{{match.model.tag}}</small>
      </a>
</script>

所以，使用该代码我想在用户在输入字段中输入一些字符后提及一些结果，这里是输入字段的代码：

<div class="wrp-search">
        <div class="labelsearch"><img src="images/bulb-black.png" alt=""/> Tulis Jenis Pemeriksaan</div>
        <input type="text" ng-model="$parent.nama" placeholder="Contoh: Diabetes" uib-typeahead="item as item.name for item in dataall | filter:{tag:$viewValue} | limitTo:10" typeahead-min-length="2" typeahead-template-url="customTemplateall.html">
        <input type="submit" class="btn-green" ng-click="cari()" />
</div>

所以，我希望有多个搜索结果，例如：1 MG Labs

因此，当用户点击打字头时，它会转到多个结果，当用户点击“GO”时，它会指向结果。

我有什么必须做的吗？

更新

这是mycontroller中的范围：

$scope.onSelect = function ($item, $model, $label) {
        $scope.$item = $item;
        $scope.$model = $model;
        $scope.$label = $label;
            // alert($scope.$item.name);
            $http({
              method: 'POST',
              url: '/api/v1/order/cart/add/byname',
              data: {
                name: $scope.$item.name
              }
            }).success(function(){
              // $window.location.href = 'order/pemeriksaan';
              $scope.cartget();
              $scope.nama.name = ""; //this is the code
            }).error(function(){
              alert("pencarian gagal");
            })
      };

Answer 1

您可以使用角度ui-bootstrap提供的以下功能：

$scope.onSelect = function ($item, $model, $label) {
    //$scope.$item = $item;
    //$scope.$model = $model;
    //$scope.$label = $label;

};

只要用户从typeahead中选择任何选项，此函数就会运行。所以你可以打开一个模态来显示多个结果。

您可以在此处的typeahead设置标题下找到此功能： http://angular-ui.github.io/bootstrap/#/typeahead

示例：

$scope.onSelect = function ($item, $model, $label) {
    var id = $item.id;
    // This function opens a modal
    // You could also create an alert
    $scope.getMarketPlayerID(id);
    // This statement clears the input to blank
    $scope.selected = "";
};

ng单击内部脚本类型ng模板不起作用

1 个答案: