Question

当我使用名为addGroup的函数向列表添加数据时出现问题。它正在给我这种类型错误：

:r1 a owl:ObjectProperty .
:r2 a owl:ObjectProperty .
:x a owl:Thing .
:better a owl:ObjectProperty;
    owl:propertyChainAxiom (:r1 :r2) .
:Red a owl:Class;
    rdfs:subClassOf [
        a owl:Restriction;
        owl:onProperty :r1;
        owl:hasValue :x
    ] .
 :Blue a owl:Class;
    rdfs:subClassOf [
        a owl:Restriction;
        owl:onProperty [owl:inverseOf :r2];
        owl:hasValue :x
    ] .

html代码：

   "TypeError: Cannot read property 'push' of undefined"
    at r.$scope.addGroup (main.js:7)
    at fn (eval at compile (angular.js:13365), <anonymous>:4:215)
    at e (angular.js:23613)
    at r.$eval (angular.js:16052)
    at r.$apply (angular.js:16152)
    at HTMLAnchorElement.<anonymous> (angular.js:23618)
    at HTMLAnchorElement.dispatch (jquery.min.js:3)
    at HTMLAnchorElement.q.handle (jquery.min.js:3)
(anonymous) @ angular.js:12520
(anonymous) @ angular.js:9292
$apply @ angular.js:16157
(anonymous) @ angular.js:23618
dispatch @ jquery.min.js:3
q.handle @ jquery.min.js:3

js code：

<ul ng-repeat = "info in infos | filter:curInfo.name">
       <img src="{{info.image.link}}"/> {{info.name}}
        <li ng-repeat="group in info.groups | filter: curInfo" 
            ng-bind-html="group.name | highlight:curInfo.name">
           <a href="#">{{group.name}}</a>
        </li>
             <div class="add list">
                <a href="" ng-click="addGroup()">+Add group </a>
             </div>
    </ul>

json数据

app.controller('mainCtrl', function($scope , dataService){
        $scope.addGroup = function () {
            var group = {name: "This is a new group"};
            $scope.infos.push(group);
        };

我使用了导航栏来显示这些数据。 “groups”部分显示在

中，现在我希望addGroup函数添加新的列表项，但它会添加到ul标记中。

Answer 1

主要问题似乎是未初始化的$scope.infos变量。我猜这个变量的内容是通过您的dataService服务获取的，并且您的目的是推送到groups某个元素的$scope.infos成员。< / p>

为此，您的addGroups需要知道要推送哪个groups，因此需要将info或info.groups作为参数传递（我选择了后者。

这是我认为你想要完成的一个简化版本。

＆＃13;

angular.module('app', [])

.factory('dataService', ['$q', function($q) {
  //dummy service simulating actual dataService
  
  var infos = [
   {
      "id":736,
      "name":"Systems",
      "image":{
         "link":"http://i.stack.imgur.com/8KA9j.jpg?s=32&g=1"
      },
      "groups":[
         {
            "id":2168,
            "name":"API",
            "url":"https://wwww.itschools.co.za/api/"
         },
         {
            "id":11955,
            "name":"Assets",
            "url":"https://wwww.itschools.co.za/assets/"
         },
         {
            "id":3179,
            "name":"Design",
            "url":"https://wwww.itschools.co.za/design/"
         },
         {
            "id":207,
            "name":"Development",
            "url":"https://wwww.itschools.co.za/development/"
         },
         {
            "id":70,
            "name":"Intranet",
            "url":"https://wwww.itschools.co.za/intranet/"
         }
      ],
      "url":"https://wwww.itschools.co.za/projects"
   },
   {
      "id":44315,
      "name":"User Agents",
      "image":{
         "link":"http://www.zerohedge.com/sites/default/files/pictures/picture5781.jpg"
      },
      "groups":[
         {
            "id":191599,
            "name":"Alchemy",
            "url":"https://wwww.itschools.co.za/tools/alchemy"
         },
         {
            "id":86822,
            "name":"Empathy",
            "url":"https://wwww.itschools.co.za/tools/empathy"
         },
         {
            "id":86297,
            "name":"Epiphany",
            "url":"https://wwww.itschools.co.za/tools/epiphany"
         },
         {
            "id":131837,
            "name":"Harmony",
            "url":"https://wwww.itschools.co.za/tools/hamony"
         },
         {
            "id":174338,
            "name":"Zagreb",
            "url":"https://wwww.itschools.co.za/tools/zagreb"
         }
      ],
      "url":"https://wwww.itschools.co.za/tools"
    }
  ];
  
  return {
    infos: function() {
      return $q.resolve(infos);
    }
  }
}])

.controller('mainCtrl', ['$scope', 'dataService',
function($scope, dataService) {
  dataService.infos().then(function(infos) {
    $scope.infos = infos;
  });
  
  $scope.addGroup = function(groups) {
    var group = {name: "This is a new group"};
    groups.push(group);
  };
}])

;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script>

<div ng-app="app">
  <div ng-controller="mainCtrl">
    <!-- filter and highlight stuff removed for simplicity -->
    <ul ng-repeat = "info in infos">
      <img src="{{info.image.link}}"/> {{info.name}}
      <li ng-repeat="group in info.groups">
         <a ng-href="{{group.url}}">{{group.name}}</a>
      </li>
      <div class="add list">
        <a href="" ng-click="addGroup(info.groups)">+Add group </a>
      </div>
    </ul>
  </div>
</div>

＆＃13;

dataService被模拟，因为它没有在问题中提供，但应该清楚如何将其转换为可以通过例如获取内容的内容。 $http服务。

另一项更改是在每个组ng-href="{{group.url}}"上使用<a>;它没有被提及，但我认为这是网址成员的用途。

如何在angularjs中推送数据

1 个答案: