Question

大家快乐的一天，

我已经开始研究角度种子项目了。我找到了jsfiddle with TODO example，并希望添加另一个＆lt; input type-"text">

有没有办法拆分＆lt; input type-"text">使其在同一行中看起来像两个<input type-"text">？我的想法与此jsfiddle made with jQuery类似，其中合并后的字符串应添加到<li>元素

非常感谢，

app.html

 <div ng-controller="MyCtrl">
        <input type="text" ng-model="enteredName" />
        <button ng-click="addName()">Add</button>
        <ul>
            <li ng-repeat="name in names">
                {{ name }}
                <button ng-click="removeName(name)">&times;</button>
            </li>
        </ul>
    </div>

app.js

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.names = ['batman', 'grumpy', 'yulu'];

    $scope.addName = function(){
        $scope.names.unshift($scope.enteredName);   
    }

    $scope.removeName = function(name) {
        var i = $scope.names.indexOf(name);
        $scope.names.splice(i, 1);
    }
}

Answer 1

你不想让它＆＃34;看起来像＆＃34; 两个输入，你实际上使用2个输入并将你的字符串数组更改为只有一个对象数组观点略有变化。

 $scope.names = [{first: 'bat',last: 'man'}];

查看

<input type="text" ng-model="enteredName.first" />
<input type="text" ng-model="enteredName.last" />
<button ng-click="addName()">Add</button>
<ul>
   <li ng-repeat="name in names">
      First: {{ name.first }} Last: {{ name.last }}
      <button ng-click="removeName(name)">&times;</button>
   </li>
</ul>

的 DEMO

使用Angular.js拆分<input type =“text”/>

1 个答案: