Javascript 角接头不工作_Javascript_Html_Angularjs_Array Splice

Javascript 角接头不工作

javascript html angularjs

Javascript 角接头不工作,javascript,html,angularjs,array-splice,Javascript,Html,Angularjs,Array Splice,我在products.json中的数据如下： { "products":[ { "name":"Antricot de vita", "calorii":236, "proteine":17.4, "lipide":18.5, "carbohidrati":0, "fibre":0 }, { "name":"Muschi de vita crud", "calorii":215, "proteine

我在products.json中的数据如下：

{
"products":[
{
     "name":"Antricot de vita",
     "calorii":236,
     "proteine":17.4,
     "lipide":18.5,
     "carbohidrati":0,
     "fibre":0
  },
  {
     "name":"Muschi de vita crud",
     "calorii":215,
     "proteine":19,
     "lipide":15,
     "carbohidrati":0,
     "fibre":0
  },
  {
     "name":"Albus de ou",
     "calorii":52,
     "proteine":10.9,
     "lipide":0.2,
     "carbohidrati":0.7,
     "fibre":0
  }
 ]
}

如你们所见，我有一个叫做products的数组，它有一些对象，每个对象有6个属性。我有一个表，其中每个tr都有6个tds，具有所提到的属性。单击每个tr右侧的按钮时，我希望删除该tr。当我必须从表中删除一个元素时，就会出现问题。我尝试了一个拼接功能，但似乎不起作用。请帮我解决这个问题。非常感谢你！ PS：推送功能确实有效

下面是我的代码： app.js

var-app=angular.module（'carori'，[]）；
app.factory（'products'，['$http'，function（$http）{
返回$http.get（'products.json'）
.成功（功能（数据）{
返回数据；
})
.错误（函数（数据）{
控制台日志（“错误”）；
返回数据；
});
}]);
app.controller（'HomeController'，['$scope'，'products'，function（$scope，products）{
产品.成功（功能（数据）{
$scope.produse=数据；
$scope.predicate='name'；
$scope.reverse=false；
$scope.order=函数（谓词）{
$scope.reverse=（$scope.predicate==谓词）！$scope.reverse:false；
$scope.predicate=谓词；
};
$scope.removietem=函数（项）{
var index=$scope.produse.products.indexOf（项目）；
$scope.produse.products.拼接（索引1）；
};
$scope.add=函数（）{
如果（angular.isDefined（$scope.name）&&&$scope.name！=''&&$scope.carori>=0&&
$scope.proteine>=0&&$scope.lipide>=0&&$scope.carbohidrati>=0&&
$scope.fibre>=0）{
$scope.produse.products.push({
名称：$scope.name，
卡路里：$scope.carori，
proteine:$scope.proteine，
lipide:$scope.lipide，
carbohidrati:$scope.carbohidrati，
光纤：$scope.fibre
});
$scope.name=''；
$scope.carori=''；
$scope.proteine=''；
$scope.lipide=''；
$scope.carbohidrati=''；
$scope.fibre=''；
}否则{
警报（“联合国大学空间信息中心”）；
}
};
});
}]);
应用程序指令（'myElement'，函数（）{
返回{
范围：{
项目：'=myElement'
},
限制：“EA”，
模板：{{item.name}{{item.carorii}{{item.proteine}{{item.lipide}{{item.carbohidrati}}{{item.fiber}
};
});

index.html

<!DOCTYPE html>
<html>
<head>
  <title>Calorii</title>
    <script src="js/shared/angular.js"></script>
    <script src="js/shared/jquery-2.2.2.min.js"></script>
   <link href="css/main.css" rel="stylesheet" />
</head>
<body ng-app="Calorii" ng-controller="HomeController">
  <div class="main">
    <div id="header">
      <img src="images/kilocalorii-logo.png">
      <ul id="nav">
        <li id="menulink"><a href="index.html" title="Tabelul de calorii"></a></li>
        <li id="genlink"><a href="#" title="Despre tabelul de calorii"></a></li>
        <li id="searchspot">
        <form id="searchform" class="searchform">
          <input id="s" type="search" ng-model="query">
        </form>
        </li>
      </ul>
      <div id="rapidfindlabel"></div>
    </div>
        <div class="content">
          <a href="#" class="noSort" ng-click="predicate=''">Doresc tabelul nesortat</a>
          <table class="tabelcalorii"> 
          <tbody>
          <tr>
            <th class="left">
            <a href="#" class="sort" ng-click="order('name')">Aliment</a>
            <span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
            </th>
            <th>
              <a href="#" class="sort" ng-click="order('calorii')">Calorii</a>
              <span class="sortorder" ng-show="predicate === 'calorii'" ng-class="{reverse:reverse}"></span>
            </th>
            <th>
              <a href="#" class="sort" ng-click="order('proteine')">Proteine</a>
              <span class="sortorder" ng-show="predicate === 'proteine'" ng-class="{reverse:reverse}"></span>
            </th>
            <th>
              <a href="#" class="sort" ng-click="order('lipide')">Lipide</a>
              <span class="sortorder" ng-show="predicate === 'lipide'" ng-class="{reverse:reverse}"></span>
            </th>
            <th>
              <a href="#" class="sort" ng-click="order('carbohidrati')">Carbohidrati</a>
              <span class="sortorder" ng-show="predicate === 'carbohidrati'" ng-class="{reverse:reverse}"></span>
            </th>
            <th>
              <a href="#" class="sort" ng-click="order('fibre')">Fibre</a>
              <span class="sortorder" ng-show="predicate === 'fibre'" ng-class="{reverse:reverse}"></span>
            </th>
            <th>Scoate din lista</th>
          </tr>
          <tr ng-repeat="product in produse.products | orderBy:predicate:reverse | filter:query" my-element="product"></tr>
        </tbody>
        </table>

        <p class="more"><strong>Nota:</strong> Toate valorile nutritive sunt calculate pentru o cantitate de 100g.</p>
        <p style="margin-left:5px">Daca nu ai gasit alimentul cautat, adauga-l completand tabelul de mai jos:</p>

        <table cellspacing="1" cellpadding="4" width="100%" class="add_table">
        <tbody>
          <tr>
            <td class="add_name"><b>Aliment:</b></td>
            <td class="add_value"><input type="text" ng-model="name" placeholder="Introdu numele alimentului" style="width: 215px"><br></td>
            <td><span class="sugestie">exemplu: <b>Pate de porc cu verdeturi Bucegi</b></span></td>
          </tr>
          <tr>
            <td class="add_name" valign="top"><b>Calorii:</b></td>
            <td class="add_value"><input type="number" ng-model="calorii" placeholder="Introdu numarul de calorii" style="width: 215px"><br></td>
            <td><span class="sugestie">completarea numarului de calorii este obligatorie</span></td>
          </tr>
          <tr>
            <td class="add_name" valign="top"><b>Proteine:</b></td>
            <td class="add_value"><input type="number" ng-model="proteine" placeholder="Introdu numarul de proteine" style="width: 215px"><br></td>
            <td><span class="sugestie">completarea numarului de proteine este obligatorie</span></td>
          </tr>
          <tr>
            <td class="add_name" valign="top"><b>Lipide:</b></td>
            <td class="add_value"><input type="number" ng-model="lipide" placeholder="Introdu numarul de lipide" style="width: 215px"><br></td>
            <td><span class="sugestie">completarea numarului de lipide este obligatorie</span></td>
          </tr>
          <tr>
            <td class="add_name" valign="top"><b>Carbohidrati:</b></td>
            <td class="add_value"><input type="number" ng-model="carbohidrati" placeholder="Introdu numarul de carbohidrati" style="width: 215px"><br></td>
            <td><span class="sugestie">completarea numarului de carbohidrati este obligatorie</span></td>
          </tr>
          <tr>
            <td class="add_name" valign="top"><b>Fibre:</b></td>
            <td class="add_value"><input type="number" ng-model="fibre" placeholder="Introdu numarul de fibre" style="width: 215px"><br></td>
            <td><span class="sugestie">completarea numarului de fibre este obligatorie</span></td>
          </tr>
              <button class="submit" ng-click="add()">ADAUGA</button>
          </tbody>
        </table>
        </div>
    </div>

     <!-- Modules -->
    <script src="js/app.js"></script>


 </body>
</html>


卡里尼






斯考特丁利斯塔酒店
注：蟾蜍缬草营养素不能计算100克的甘氨酸戊酯
Daca nu ai gasit alimentul cauta，adauga-l complete and tablul de mai jos:
赡养费：


例如：贝尔德图里·布塞吉公园
卡路里：


义务人热量补充协议
蛋白质：


新马鲁利蛋白复合物
脂质：


履行义务的义务
卡波希德拉蒂：


无碳综合义务
纤维：


无纤维复合物
阿杜加

我知道上面有很多代码，但如果您不介意的话，如果您能简单地解释一下如何在我的json产品上调用splice函数，我将不胜感激。再次感谢

indexOf有时无法在数组中找到对象的索引。您可以使用lodash或下划线，也可以更改方法：

<td><a ng-click="removeItem($index)">Remove</a></td>

在angular中使用ng repeat时，$index可用。

indexOf有时无法在数组中找到对象的索引。您可以使用lodash或下划线，也可以更改方法：

<td><a ng-click="removeItem($index)">Remove</a></td>

在angular中使用ng repeat时，$index对您可用。

您对myElement指令有问题

ng-click="removeItem(product)"

应该是

ng-click="removeItem(item)".

您对myElement指令有问题

ng-click="removeItem(product)"

应该是

ng-click="removeItem(item)".

如果你想在这里找到答案，你真的需要用更少的代码来隔离问题，而不是依赖indexOf函数来获取项目索引，你应该从前面传递它。ng单击=“removeItem（$index）”，然后在控制器中使用该参数作为索引，以便在您的

函数removeItem

中放置

警报或控制台时进行编辑。日志是否有效？我认为您的指令中有一个问题，没有找到您的控制器范围。@FelippeDuarte似乎没有。如果您想在这里找到答案，您真的需要用更少的代码来隔离问题……而不是依赖indexOf函数来获取项目索引，您应该从前面传递它。ng单击=“removeItem（$index）”，然后在控制器中使用该参数作为索引，以便在您的