如何在按钮上的Angularjs中的控制器之间传递数据单击! [英] How Do I Pass Data Between Controllers In Angularjs On A Button Click!

查看:71
本文介绍了如何在按钮上的Angularjs中的控制器之间传递数据单击!的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述





我是AngularJS的新手。我有一个以下功能,我有一个FirstName字段和LastName字段(在两个不同的控制器中),然后单击一个按钮,我想在第三个控制器中显示FullName(名字+姓氏)。请建议我怎么做。这是我的代码:



Hi,

I am new to AngularJS. i am having a following functionality where i am having a FirstName field and LastName Field(in two Different Controllers) and then on the click of a button i want to show FullName(First Name + Last Name) in a third Controller . Please Suggest me how to do. Here is my code:

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
</head>

<body>
   <div ng-app="myApp">

       <h2>Controller 1</h2><br />
        <div ng-controller="FirstCtrl">
            <input type="text" ng-model="Data.FirstName">
            <br>FirstName is : <strong>{{Data.FirstName}}</strong>
        </div>
        <hr>
       <h2>Controller 2</h2><br />
        <div ng-controller="SecondCtrl">
            <input type="text" ng-model="Data.LastName">
             <br>LastName is : <strong>{{Data.LastName}}</strong>
        </div>
      <h2>Controller 3</h2><br />
       <div ng-controller="ThirdCtrl">
           <button ng-click="getName(Data)">Get full Name</button>
            FullName is : {{getName(Data)}}

        </div>

    </div>
    </div>

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


        myApp.factory('Data', function () {
            return { FirstName: '',LastName:'' };
        });

        myApp.controller('FirstCtrl', function ($scope, Data) {
            $scope.Data = Data;
        });

        myApp.controller('SecondCtrl', function ($scope, Data) {
            $scope.Data = Data;
        });
        myApp.controller('ThirdCtrl', function ($scope, Data) {
            $scope.Data = Data;
            $scope.getName = Data;
        });
    </script>
</body>
</html>

推荐答案

范围,数据){


scope.Data =数据;
});

myApp.controller('SecondCtrl',函数(
scope.Data = Data; }); myApp.controller('SecondCtrl', function (


范围,数据){


这篇关于如何在按钮上的Angularjs中的控制器之间传递数据单击!的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆