AngularJS如何获取一个数组,该数组将数字添加到函数中的元素,然后用另一个函数分散其注意力

AngularJS how to get an array that adds a number to an element in a function and later distracts it with another function

本文关键字:数组 函数 元素 注意力 分散 另一个 然后 获取 何获取 数字 AngularJS      更新时间:2023-09-26

所以我想创建一个应用程序,如果this.parts[partId].comp[i]中提到了this.parts部分中部分的id,则需要一个数组向元素添加一个数字。但是,如果我尝试运行该函数,它会在警报NaN而不是元素的值中。为什么它不是一个数字,我该如何解决它?

应用.js:

(function(){
var app = angular.module('kompileApp', []).controller('partsList', function($scope){
    this.parts = parts;
    // this.ps = partSelected;
    this.order = orderString;
    this.ap = aantalProducts;
    this.aa = addedArray;
    this.aaString = addedArrayString;
    this.jaddString = justAdded;
    this.cc = compCount;
    this.jadd = function(partId){
        this.jaddString = parts[partId - 1].id + ': ' + parts[partId - 1].name + ', ' + parts[partId - 1].price + '| ';
        this.aa[partId - 1] = this.jaddString;
    };
    this.arrayToString = function(){
        for (i = 0; i < this.aa.length; i++){
            if(this.aa[i] != undefined){
                this.aaString = this.aaString + this.aa[i];
                this.aa[i];
            };
        };
    };
    this.stillPossible = function(partId){
        for(i = 0; i < this.parts[partId - 1].comp.length; i++){
            if(this.parts[partId - 1].comp[i] != undefined){
                this.parts[(this.parts[partId - 1].comp[i]) - 1].canAdd = false;
                this.cc[this.parts[(this.parts[partId - 1].comp[i]) - 1]] = this.cc[this.parts[(this.parts[partId - 1].comp[i]) - 1]] + 1;
                alert(this.cc[this.parts[(this.parts[partId - 1].comp[i]) - 1]]); //this alert gives 'NaN' (Not a Number)
            };
        };
        this.parts[partId - 1].added = true;
    };
    this.nowPossible = function(partId){
        for(i = 0; i < this.parts.length; i++){
            for (j = 0; j < this.cc.length; j++){

                if(this.parts[i].comp[j] != undefined || this.parts[i].added === true){
                    this.cc[this.parts[(this.parts[i].comp[j]) - 1]] = this.cc[this.parts[(this.parts[i].comp[i]) - 1]] - 1 ;
                    if (this.cc[this.parts[(this.parts[i].comp[j]) - 1]] === 0){
                        this.parts[(this.parts[i].comp[j]) - 1].canAdd = true;
                        alert('123');
                    };
                };
            };
        };
        this.parts[partId - 1].added = false;
    };
});
this.ccInit = function(){
    for (i = 0; i < this.cc.length; i++){
        this.cc[i] = 0;
    }
};
var parts = [
{
id: 1,
name: 'vitamine A',
price: 3,
canAdd: true,
added: false,
comp: [2, 5]
},
{
id: 2,
name: 'vitamine B',
price: 5,
canAdd: true,
added: false,
comp: [1]
},
{
id: 3,
name: 'vitamine C',
price: 2,
canAdd: true,
added: false,
comp: []
},
{
id: 4,
name: 'Opium',
price: 20.95,
canAdd: true,
added: false,
comp: []
},
{
id: 5,
name: 'steroids',
price: 12.5,
canAdd: true,
added: false,
comp: [1]
}
];
var orderString = "i am the orderstring...";
/*
for (i=0;i<parts.length; i++){
orderString = text = $('p' + i).text();
}
*/
var aantalProducts;
aantalProducts = 0;
var addedArray = new Array(parts.length);
var addedArrayString = '';
var compCount = new Array(parts.length);
var justAdded = '';
})();

.html:

<ul class="plist">
        <li ng-repeat="part in pl.parts | orderBy:'+price'" ng-hide="part.added || !part.canAdd" class="plLi">
            <div class="plistDivName">
                {{part.name}}   <!--alternatief: <span ng-bind="part.name"></span> -->
                {{part.price | currency : "&euro;"}}    <!--| currency om 2 cijfers na de komma te krijgen        alternatief: <span ng-bind="part.price | currency"></span> -->
            </div>
            <div class="plistDivButton">
                <button ng-click="pl.ap = pl.ap + 1; pl.jadd(part.id); pl.stillPossible(part.id)" ng-show="part.canAdd" class="plistbutton">add</button> <!-- veranderd value van pl.parts.added naar true -->
            </div>
        </li>
    </ul>
</div>
<!-- list van ge-adde parts-->
<div class="plistDiv">
<p class="plistP">your product:</p>
    <ul class="plist">
        <li ng-repeat="part in pl.parts | orderBy:'+price'" ng-show="part.added" class="plLi">
            <div class="plistDivName">
                {{part.name}}
                {{part.price | currency : "&euro;"}} <!-- | currency om 2 cijfers na de komma te krijgen -->
            </div>
            <div class="plistDivButton">
                <button ng-click="pl.nowPossible(part.id); pl.ap = pl.ap - 1; pl.aa[part.id - 1] = ''" class="plistbutton">remove</button> <!-- verranderd value van pl.parts.added naar false -->
            </div>
        </li>
    </ul>
你调试

过代码吗?尝试使用浏览器的开发人员工具进行调试(例如 https://developers.google.com/web/tools/chrome-devtools/)

您可以设置断点并在添加之前和之后检查值。

此外,使用角度$log.log("值是:",someValue);注销对象和值。

我的猜测是,该值不是您认为的那样(未定义,字符串等)。

使用 $log 或 alert 显示用于获取结果的值(如果你知道如何操作,也可以通过调试执行此操作)

alert(partId);
alert(this.parts[partId - 1]);
alert(this.parts[partId - 1].comp[i]);
alert(this.parts[(this.parts[partId - 1].comp[i]) - 1]);
alert(this.cc[this.parts[(this.parts[partId - 1].comp[i]) - 1]]);

在代码中重新访问以下行:

this.cc[this.parts[(this.parts[partId - 1].comp[i]) - 1]] = this.cc[this.parts[(this.parts[partId - 1].comp[i]) - 1]] + 1;

这里有两点需要注意:

  1. 首先this.cc数组是具有空白值的数组。
  2. 第二个也是最重要的 上行中的this.parts[(this.parts[partId - 1].comp[i]) - 1]将标识一个对象而不是一个数字,因此 this.cc[不会是数值],所以上面的行不会给出想要的结果。