Question

我的项目中有两个屏幕，即MemberList.HTML和EditMember.html。 MemberList.HTML显示每个成员的编辑链接的所有成员。当我点击编辑链接时，它会调用函数ng-click =＆＃34; EditMember（member）＆＃34;和EditMember（成员）的代码是

$scope.EditMember = function (member) {
    var getData1 = angularService.GetMember(member.ID);
    getData1.then(function (mem) {
        $scope.Member = mem.data;
        alert($scope.Member.FirstName);
        $location.path('/members/editmember');
    }, function (error)
        {
            alert('Error in getting Member record');
        }
    );
};

EditMember.Html的代码

<div>
    <div class="bottom-margin">
        <div class="left-label">ID</div>
        <div><input type="text" name="txtID" id="txtID" ng-model="Member.ID"/></div>
    </div>
    <div class="bottom-margin">
        <div class="left-label">First Name</div>
        <div><input type="text" name="txtFirstName" ng-model="Member.FirstName"/></div>
    </div>
</div>        
<div>
    <div class="bottom-margin">
        <div class="left-label"><input type="button" name="btnCancel" value="Cancel" /></div>
        <div><input type="button" name="btnSave" value="Save" /></div>
    </div>
</div>

路线配置

 $routeProvider.when('/members/editmember',
        {
            templateUrl: '/Template/EditMember.html',
            controller: 'myCntrl'
        });

现在的问题是，在警告中它显示了名字，但它没有在EditMember.Html中显示任何数据。

一切都在相同的角度控制器中，这里没有使用不同的控制器。

如何将带有成员数据的$ scope传递给EditMember.Html？我做错了什么？

Answer 1

与服务不同，控制器不是角度的单例。更改位置后，将创建该控制器的新实例，从而创建新范围。

就个人而言，我会将URL中的引用传递给您要编辑的成员，例如/members/edit/1234，并在控制器加载时或在使用$routerProvider resolve进行路由期间加载该数据。

就个人而言，我还会考虑使用不同的控制器进行编辑和查看，并将任何共享功能转移到服务中 - 只是为了保持一致。

Answer 2

@glennanthonyb，我做了类似的事......我在这里使用相同的控制器。

在路上，我添加了

$routeProvider.when('/members/editmember/:ID',
        {
            templateUrl: '/Template/EditMember.html',
            controller: 'myCntrl'
        });

在Controller中我添加了$ routeParams参数

if ($routeParams.ID != null) {
        GetMember();
    }
    function GetMember() {
        var getData = angularService.GetMember($routeParams.ID);
        getData.then(function (mem) {
            $scope.Member = mem.data;
        }, function (error) {
            alert('Error in getting records');
        });
    }

在MemberList.Html中，我没有调用函数，而是使用href

 <a href="/members/editmember/{{member.ID}}">Edit</a>

我不确定这是否是正确的做法，但它正在发挥作用。

在AngularJS中传递$ scope和$ location.Path（）

2 个答案: