控制器中的角度功能

时间:2014-07-22 18:55:39

标签: angularjs

如何在角度中添加功能? 我一直在努力寻找,但却没有找到任何帮助。哪里错了?我真的不知道该怎么办。我在下面写了所有细节。我尝试过但没有成功。

错误:

> TypeError: undefined is not a function
>     at addComment (http://localhost:19657/Scripts/app.js:20:30)
>     at http://localhost:19657/Scripts/angular.min.js:175:290
>     at http://localhost:19657/Scripts/angular.min.js:192:357
>     at k.$eval (http://localhost:19657/Scripts/angular.min.js:111:353)
>     at k.$apply (http://localhost:19657/Scripts/angular.min.js:112:121)
>     at HTMLFormElement.<anonymous> (http://localhost:19657/Scripts/angular.min.js:192:339)
>     at HTMLFormElement.x.event.dispatch (http://localhost:19657/Scripts/jquery-1.10.2.min.js:5:14129)
>     at HTMLFormElement.v.handle (http://localhost:19657/Scripts/jquery-1.10.2.min.js:5:10873)

我的代码:

Html代码:

<div ng-app="store" ng-controller="StoreController as item" dir="ltr">
    <div ng-repeat="product in item.products">
        <div ng-hide="product.cantBuy">
            <img style="max-width: 100px" ng-src="{{product.iamge.full}}" />
            <p>{{product.name}}</p>
            <section ng-controller="PanelController as panel">
                <ul class="nav nav-pills">
                    <li ng-class="{active:panel.isSelected(1)}">
                        <a ng-click="panel.selectTab(1)">ِDiscription</a>
                    </li>
                    <li ng-class="{active:panel.isSelected(2)}">
                        <a ng-click="panel.selectTab(2)">Price </a>
                    </li>
                    <li ng-class="{active:panel.isSelected(3)}">
                        <a ng-click="panel.selectTab(3)">Comments </a>
                    </li>
                </ul>
                <br />
                <div class="panel" ng-show="panel.isSelected(1)">
                    <h3>Comments : </h3>
                    <p>{{product.description}}</p>
                </div>
                <div class="panel" ng-show="panel.isSelected(2)">
                    <h3>Price : </h3>
                    <p>{{product.price}}</p>
                </div>
                <div class="panel" ng-show="panel.isSelected(3)">
                    <h3>Comments : </h3>
                    <blockquote ng-repeat="comment in product.comments">
                        <p>Star  : {{comment.star}}</p>
                        <p>Name : {{comment.name}}</p>
                        <p>Email : {{comment.mail}}</p>
                        <p>Comment : {{comment.comment}}</p>
                    </blockquote>
                    <br/>
                    <h5>Send Comment : </h5>
                    <form ng-controller="CommentController as commentCtrl"
                          ng-submit="commentCtrl.addComment(product)">
                        <blockquote>
                            <p>Star  : {{commentCtrl.comment.star}}</p>
                            <p>Name : {{commentCtrl.comment.name}}</p>
                            <p>Email : {{commentCtrl.comment.mail}}</p>
                            <p>Comment : {{commentCtrl.comment.comment}}</p>
                        </blockquote>
                        <p>Star : </p>
                        <select class="form-control" ng-model="commentCtrl.comment.star">
                            <option value="1">1 Star</option>
                            <option value="2">2 Star</option>
                            <option value="3">3 Star</option>
                            <option value="4">4 Star</option>
                            <option value="5">5 Star</option>
                        </select>
                        <p>Name : </p>
                        <input class="form-control" type="text" ng-model="commentCtrl.comment.name" />
                        <p>Email : </p>
                        <input class="form-control" type="email" ng-model="commentCtrl.comment.mail" />
                        <p>Comment : </p>
                        <textarea class="form-control" ng-model="commentCtrl.comment.comment"></textarea>
                        <br />
                        <br />
                        <input class="btn btn-primary" type="submit" value="Send Comment" />
                    </form>
                </div>
            </section>
            <br />
            <button ng-show="product.addBasket">Add To Basket</button>
        </div>
    </div>
</div>

app.js文件:

   var app = angular.module('store', []);

    app.controller('StoreController', function () {
        this.products = shirts;
    });
    app.controller('PanelController', function () {
        this.tab = 1;
        this.selectTab = function (setTab) {
            this.tab = setTab;
        }
        this.isSelected = function (checkSelectTab) {
            return this.tab === checkSelectTab;
        }
    });

    app.controller('CommentController', function () {
        this.comment = {};
        this.addComment=function(product) {
            product.comments.add(this.comment);
        }
    });
     var shirts = [
      {
            name: 'Adiddas'
            price: '10',
            description: '.........',
            addBasket: true,
            cantBuy: false,
            iamge: {
                full: '.........'
            },
            comments: [
                {
                    star:3,
                    name: "Jack",
                    mail: 'sss.dddd@gmail.com',
                    comment:'.......'
                },
                {
                    star: 2,
                    name: "Sara",
                    mail: "sf@gmail.com",
                    comment: '.........'
                }
            ]
        }
     ];

1 个答案:

答案 0 :(得分:1)

使用javascript中的数组,你不会调用。添加你调用.Push更改此代码:

product.comments.add

product.comments.push

你的错误是说添加不是一种功能。