在AngularJS中如何使用datalist

gpnt7bae 于 6个月前发布在 Angular

关注(0)|答案(2)|浏览(45)

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>

<div ng-app="" ng-controller="cntryController">
    <input list="testList" type="" ng-model="SelectedDoctor" ng-change="LoadSessionData(SelectedDoctor)" />
    <datalist id="testList">
        <option value="Dr.Test1" ng-selected="selected"></option>
        <option value="Dr.Test2"></option>
        <option value="Dr.Test2"></option>
    </datalist>
</div>

字符串
控制器

function cntryController($scope) {
    $scope.LoadSessionData = function(val) {
        console.log(val);
    };
}

型
检查此链接http://jsbin.com/jifibugeke/1/edit?html,js,console,output
上面提到的datalist示例代码和URL使用angularjs，这里我的问题是我在输入文本框时，在控制器中添加了每一个单词，在我的要求中，datalist选择的细节只显示在控制器中，

angularjs

来源：https://stackoverflow.com/questions/29531889/in-angularjs-how-to-use-datalist

2条答案

按热度按时间

weylhg0b1#

HTML

<div ng-app="myapp1" ng-controller="cntryController">
    <input list="testList" type="" ng-model="SelectedDoctor" ng-change="LoadSessionData(SelectedDoctor)" />
    <datalist id="testList">
        <option ng-repeat="x1 in names" value="{{x1.drname}}">
    </datalist>
</div>

字符串
JavaScript

<script>
    var app=angular.module('myapp1',[]);
    app.controller('cntryController',function ($scope) {
//data for ng-repeat
    $scope.names=[{'drname':'Dr.Test1'},{'drname':'Dr.Test2'},{'drname':'Dr.Test3'}]
    $scope.LoadSessionData = function(val) {
//console log
        console.log(val);
    }
});
</script>

型
JSbin上的示例

赞(0）回复(0）举报 6个月前

lvjbypge2#

这是正确的方式为角：

<input list="Calle" type="text" ng-model="xCalle"  >
    <datalist name="Calle" id="Calle" >
        <option value="11 DE SEPTIEMBRE DE 1888">
        <option value="12 DE OCTUBRE">
    </datalist>

字符串
Watch type=“text”以及名称、ID和ng-model的放置位置。
这将与angular一起工作，而不需要任何JavaScript附加功能。

赞(0）回复(0）举报 6个月前

我来回答

在AngularJS中如何使用datalist

2条答案

相关问题

热门标签

最新问答