AngularJS将项目推送到$ scope数组的第一个或0个索引

sha*_*c19 24 javascript angularjs angularjs-scope

请帮我实现这个功能.我的一系列物品$scope.现在,当我单击Add Item按钮时,我想将一个新项目推送到该数组的第一个索引或0索引.提前致谢.:)

这是一个有用的jsFiddle:http://jsfiddle.net/limeric29/7FH2e/

HTML:

<div ng-controller="Ctrl">
    {{data}}<br/>
    <input type="button" ng-click="addItem()" value="Add Item" />
</div>
Run Code Online (Sandbox Code Playgroud)

JavaScript的:

function Ctrl($scope) {
    $scope.data = [
    new String('Item 5'), new String('Item 4'), new String('Item 3'), new String('Item 2'), new String('Item 1')];

    $scope.addItem = function () {
        var c = $scope.data.length + 1;
        var item = new String('Item ' + c)
        $scope.data.push(item);
    };
}
Run Code Online (Sandbox Code Playgroud)

小智 31

您可以使用unshift功能.

function Ctrl($scope) {
$scope.data = [
new String('Item 5'), new String('Item 4'), new String('Item 3'), new String('Item 2'), new String('Item 1')];

$scope.addItem = function () {
    var item = new String('Item ' + c)
    $scope.data.unshift(item);
};
}
Run Code Online (Sandbox Code Playgroud)


sha*_*c19 29

通过使用splice()而不是push()并分配要插入的数组索引解决了我的问题.

HTML:

<div ng-controller="Ctrl">
    <pre>{{data}}</pre><br/>
    <input type="button" ng-click="addItem()" value="Add Item" />
</div>
Run Code Online (Sandbox Code Playgroud)

使用Javascript:

function Ctrl($scope) {
    $scope.data = [
    new String('Item 4'), new String('Item 3'), new String('Item 2'), new String('Item 1')];

    $scope.addItem = function () {
        var c = $scope.data.length + 1;
        var item = new String('Item ' + c)
        $scope.data.splice(0, 0, item);
    };
}
Run Code Online (Sandbox Code Playgroud)

这是更新的小提琴.http://jsfiddle.net/limeric29/xvHNe/

  • 你也可以使用`unshift`.这是将元素预先添加到数组的常用方法. (16认同)

WtF*_*dgE 15

$scope.data.unshift(item);
Run Code Online (Sandbox Code Playgroud)

一线,不知道为什么其他人这么难