2017-02-15 63 views
0
工作

我采用了棱角分明JS1和温泉UIAngularJS 1选择框不OnsenUI

在这里选择输入不Angularjs1工作我如何使用该输入

<ons-page> 

    <ons-toolbar> 
    <div class="center">My App</div> 
    </ons-toolbar> 

    <div style="text-align: center; margin-top: 30px;"> 

    <p> 
     <select modifier="tappable"> 
      <option value="">Select Car Model</option> 
      <option >1</option> 
      <option >2</option> 
     </select> 
    </p> 

    <p style="margin-top: 30px;"> 
     <ons-button ng-click="submitLogin()">Sign in</ons-button> 
    </p> 



    </div> 

</ons-page> 
+0

它不起作用?发生了什么,应该发生什么? – brhardwick

+0

你如何绑定到下拉菜单?我没有看到任何类型的绑定。 – lintmouse

回答

0

您可能忽略的ng-model属性存储用于ng-click的值。再次,没有看到你的js代码它有点困难。但你可以尝试:

<p> 
    <select modifier="tappable" ng-model="CarModel"> 
     <option disabled selected value="">Select Car Model</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
    </select> 
</p> 

<p style="margin-top: 30px;"> 
    <ons-button ng-click="submitLogin()">Sign in</ons-button> 
</p> 

然后你可以通过使用$ scope.CarModel在角码中调用它。在这里,你会看到1或2作为值。

上述代码更具有角度的方法是将对象绑定到select,以便您可以从代码或后端控制它。 在AngularJs代码,你可以把它定义为这样:

$scope.DataSet = [{Display:"One",Value:1},{Display:"Two",Value:2}]; 

而上的标记:

<select ng-model="CarModel" ng-options="Data.Value as Data.Display for Data in DataSet"></select> 

在这种情况下,角将为您生成的标记和值分配到模型时你点击一个选项。

另一方面,第一个选项的禁用和选定属性允许您强制用户选择除占位符以外的其他属性。