在angularJS中使用模态窗口时,在控制器之间共享对象数组

时间:2016-04-29 09:39:27

标签: javascript angularjs

我正在尝试使用一个对象数组,我在两个控制器之间共享,其中一个控制器处理模态窗口。

这是js代码。

angular.module('MyApp', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache', 'ui.bootstrap'])
  .service('Faq', function ($http) {
    this.faqList = [];
    this.faqList = $http.get('/Json/faq.json');

    this.getFaqs = function ()
    {
        return this.faqList;
    }

    this.addfaq = function (obj) {
        this.faqList.push(obj);
    };


})
.controller('AppCtrl', function ($scope,$modal,Faq) {



    $scope.faqData = [];

    Faq.getFaqs().then(function (msg) {
        $scope.faqData = msg.data;

    });

    }

    $scope.show = function () {
        $modal.open({
            templateUrl: "faqAddUpdate.html",
            controller: "faqctrl"
        });
    };


})
.controller('faqctrl', function ($scope, $modalInstance, Faq) {
    $scope.question = '';
    $scope.id = '';
    $scope.answer = '';

    $scope.editFaq = function (id) {
        $scope.divFaq = true;
        $scope.faqs = [];
        Faq.getData().then(function (msg) {
            $scope.faqs = msg.data;
            var l = $scope.faqs.length;
            for (var i = 0; i < l; i++) {
                if ($scope.faqs[i].id == id) {
                    $scope.question = $scope.faqs[i].question;
                    $scope.id = $scope.faqs[i].id;
                    $scope.answer = $scope.faqs[i].answer;

                }
            }
        });
    };


    $scope.AddUpdateFAQ = function () {
        var faq = {
            id: $scope.id,
            question: $scope.question,
            answer: $scope.answer
        };
        Faq.addfaq(faq);
        console.log(faq);
        $modalInstance.close();
    };

    $scope.Cancel = function () {
        $modalInstance.dismiss();
    };
});

但是当我通过模态提交数据时,它说this.faqList.push不是一个函数。

2 个答案:

答案 0 :(得分:2)

这是因为你的faqList变量不是数组。

你忽略了第一个定义:

this.faqList = [];

有了这个:

this.faqList = $http.get('/Json/faq.json');

但$ http.get返回一个promise(请参阅doc),而不是数组。

你应该这样做:

this.faqList = [];
$http.get('/Json/faq.json').then(function(result) {
  // process your results here
  this.faqList = result.data;
});

答案 1 :(得分:1)

未尝试,但this在函数范围内,因此首先创建_this var可能有所帮助:

this.faqList = [];
this.faqList = $http.get('/Json/faq.json');
var _this = this;

this.getFaqs = function ()
{
    return _this.faqList;
}

this.addfaq = function (obj) {
    _this.faqList.push(obj);
};