Angularjs如何通过变量定义邀请ID?

时间:2015-06-18 14:52:33

标签: javascript angularjs google-hangouts

我正在尝试添加Google环聊按钮以通过电子邮件拨打电话。如果我硬编码电子邮件按钮工作正常,但我可以使用字符串变量的邀请ID,所以我可以动态渲染hongout按钮?示例:邀请[{id:person.email}]。

           <g:hangout render="createhangout"
                       invites="[{ id : 'foo@gmail.com', invite_type : 'EMAIL' }]">
            </g:hangout>

这是转发器代码块。我错过了什么?

 <ul>
            <li data-ng-repeat="person in contacts | orderBy:'name'">
                {{person.name}}  {{person.surname | uppercase}} --> {{person.email}} - <button ng-click="del($index)">Delete</button>
                <g:hangout render="createhangout"
                           invites="[{ id : '{{person.email}}', invite_type : 'EMAIL' }]">
                </g:hangout>
            </li>
        </ul>

但我也在尝试更新和添加新人,以便动态创建环聊按钮。我认为我的主要问题是。这就是所有代码。

  <!DOCTYPE html>
   <html data-ng-app="hangoutApp">
   <body>
    <div data-ng-controller="SimpleController">
        <h2>Add a person to contact:</h2>
        <br />
        Enter Name:
        <input type="text" data--ng-model="name" /> 
        <br />
        <br />
        Enter Surname:
        <input type="text" data--ng-model="surname" />
        <br />
        <br />
        Enter Email:
        <input type="text" data--ng-model="email" />
        <br />
        <br />
        <button ng-click="addPerson()">Add New Person</button>
        <br />
        <br />
        <ul>
            <li data-ng-repeat="person in contacts | orderBy:'name'">
                {{person.name}}  {{person.surname | uppercase}} --> {{person.email}} - <button ng-click="del($index)">Delete</button>
                <g:hangout render="createhangout"
                           invites="[{ id : '{{person.email}}', invite_type : 'EMAIL' }]">
                </g:hangout>
            </li>
        </ul>
    </div>

    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <script src="Scripts/angular.min.js"></script>
    <script>
        var hangoutApp = angular.module('hangoutApp', []);

        var controllers = {};
        controllers.SimpleController = function SimpleController($scope) {
            $scope.name = "";
            $scope.surname = "";
            $scope.email = "";
            $scope.contacts = [];
            $scope.addPerson = function () {
                this.contacts.push({
                    name: this.name,
                    surname: this.surname,
                    email: this.email
                });
            }
            $scope.del = function (ind) {
                this.contacts = this.contacts.splice(ind, 1);
            };

        }


        hangoutApp.controller(controllers);
    </script>
</body>

1 个答案:

答案 0 :(得分:0)

您可以使用代码段中的{{}}来执行此操作我还添加了一个转发器,以便您可以动态制作这些转发器。

<g:hangout  render="createhangout"
                       invites="[{ id : '{{person.Email}}', invite_type : 'EMAIL' }]">
</g:hangout>

&#13;
&#13;
var app=angular.module('myApp',[]);
app.controller('myController', ['$scope', function($scope){ 
  $scope.people = [{Email:'aEmail@gmail.com'}];
}]);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
  <div ng-repeat="person in people">
<g:hangout  render="createhangout"
                       invites="[{ id : '{{person.Email}}', invite_type : 'EMAIL' }]">
    </g:hangout>
  <span>{{person.Email}}</span>
    </div>
 </div>
&#13;
&#13;
&#13;