Question

我创建了一个处理用户创建的angularjs应用程序。通过选择用户类型，它将显示所需的输入字段。一旦你点击提交，它就会将json发送到服务器。我已经走了那么远。

我的问题是，一旦我在我的数据库中创建了新用户行，我想将该行发送回客户端，以便我可以立即将其添加到我当前显示的用户表中。

我在之前的项目中通过jQuery很容易地完成了这个，但它比我想要的封装要少一些。

因此，一旦我的用户创建应用程序（CreateUser）完成并从服务器接收数据，我将如何将该信息推送或绑定到我的用户查看表（ViewUsers）应用程序？我宁愿将它们分开，所以我可以将它们放在小部件样式中，而不是每次都要求它们。

这是我的第一个应用代码：

function CreateUsers($scope, $http){
    $scope.selectedType = '';
    $scope.formData = {};
    $scope.method = 'POST';
    $scope.url = '/createUser';
    $scope.types = [
        'Student',
        'Parent',
        'Teacher',
        'Staff'
    ];

    $scope.fields = {
        User:[
            {name: 'First Name', value: 'first_name'},
            {name: 'Last Name', value: 'last_name'},
            {name: 'Email', value: 'email'},
            {name: 'Phone', value: 'phone'}
        ],
        Employee:[
            {name: 'Start Date', value:'start_date'},
            {name: 'Branch', value:'branch'}
        ]
    };
    $scope.fields.Student = $scope.fields.User;
    $scope.fields.Parent = $scope.fields.User;
    $scope.fields.Employee = $scope.fields.User.concat($scope.fields.Employee);
    $scope.fields.Teacher = $scope.fields.Employee;
    $scope.fields.Staff = $scope.fields.Employee;


    $scope.createNewUser = function(){
        this.formData.type = this.selectedType;
        console.log($scope);
        console.log($scope.formData);

        $http({
            method: $scope.method,
            url:    $scope.url,
            data:   $scope.formData
        }).success(function(data,status){
            $scope.status = status;
            $scope.data = data; 
            console.log($scope);
        }).error(function(data,status){
            $scope.data = data || 'Request failed';
            $scope.status = status;
            console.log($scope);
        });
    }
}

非常感谢阅读。

Answer 1

将您的第一个应用订阅到$ rootScope：

function CreateUsers($scope, $http, $rootScope){
//...
}

并在$ http成功处理程序中添加：

$rootScope.$broadcast("userCreated", user);

其中user是您要添加到users数组的数据，然后在您的第二个应用中为该事件添加一个侦听器：

$scope.$on("userCreated", function(e, user){
    //push the info to your users array here.
});

这应该适用于您所描述的内容。

如何让一个AngularJS应用程序影响另一个？

1 个答案: