Question

我正在尝试使用ui-router创建待办事项应用。我可以创建任务，删除任务，但是由于这个问题我无法编辑任务。谁能帮我？

Transition Rejection（$ id：2 type：6，message：过渡错误，详细信息：错误：Transition Rejection（$ id：1 type：4，message：此过渡无效，详细信息：以下参数值不是对状态“第二”有效：[todoText：未定义]））

var app = angular.module('app', [
    'ui.router',
    'todoApp.services',
    'todoApp.controllers'
]);

app.config(['$stateProvider', function ($stateProvider) {
    $stateProvider
        .state('first', {
            url: '/new',
            templateUrl: 'detail.html',
            controller: 'CreateCtrl'
        })
        .state('second', {
            url: '/edit/:todoText',
            controller: 'EditCtrl',
            templateUrl: 'detail.html'
        })
        .state('third', {
            url: '/',
            controller: 'ListCtrl',
            templateUrl: 'list.html'

        })
        .state('root', {
            controller: 'ListCtrl',
            templateUrl: 'list.html'
        })
}]);

app.controller('EditCtrl', function ($scope, $location, $stateParams, Todos) {
        $scope.todos = Todos;

        var result = $scope.todos.filter(function (obj) {
            return obj.text == $stateParams.todoText;

        }); console.log(result);
        $scope.todoText = result[0].text;
        $scope.todoDetails = result[0].details;
        $scope.todoDate = result[0].date;
        console.log(result);
        $scope.save = function () {
            var text = $scope.todoText;
            var details = $scope.todoDetails;
            var done = $scope.todoDone;
            var date = $scope.todoDate;
            alert(text);
            angular.forEach($scope.todos, function (todo) {
                if (todo.text == text) {
                    todo.text = text;
                    todo.details = details;
                    todo.date = date;
                }
            });

            $location.path('/');
        };
    });

app.factory('Todos', function () {
    var items = [

    ]
    return items;
});

<!-- html button -->
<button class="btn btn-light">
    <a ui-sref='second()'>
        <i class="fas fa-edit"></i>Edit</i>
    </a>
</button>

Answer 1

您有一个状态second，该状态需要一个参数todoText：

.state('second', {
        url: '/edit/:todoText',
        controller: 'EditCtrl',
        templateUrl: 'detail.html'
    })

问题在于，当您调用该状态时，您不会传递任何参数：

<a ui-sref='second()'>

在这里，您需要像这样添加todoText参数：

<a ui-sref='second({todoText: todo.text})'>

Answer 2

@Bill P帮助。谢谢。

      <a ui-sref='second({todoText: todo.text})'>

AngularJS待办事项。编辑按钮出现问题

2 个答案: