Angular 1.5, calling a components function from outside an ng-repeat?

Question

Just started learning Angular 1.5 components, Trying out some of new rules, but can't seem to get my head around this:

So in my Main:`

angular.module('myapp',[])

.controller('appController',['$scope', '$interval',function($scope, $interval) {

    
    $scope.action = function(remote){
      // How do I run obj.action
    };
    
    $scope.objectList = [{name: 1},{name:2},{name:3},{name:4},{name:5}];

    $interval(runList, 1000);
    
    function runList() {
      
      // run Action on objects in objectList? obj.action?
      
      obj.action();
      
    }
}]);

// and in the obj.js file
(function(angular) {
'use strict';


angular.module('myapp').component('obj', {
    template: '<div class="box">{{obj.messsage}}</div>',
    controllerAs: 'obj',
    controller: function() {
    
    var obj = this;
    
    obj.action = function() {
      obj.message = "Updated, therefore Success";
    }
    
    
    },
    bindings: {
        ngModel: '=',
        action: '&'
    }
});
})(window.angular);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-controller="appController">
    <h1>Hello Plunker!</h1>
    
    <obj ng-model="obj" ng-repeat="obj in objectList"></obj>
   
</body>

Plunker

I just can't seem to get it through my head, how to run the components action obj.action() from the controller, in runList.

Apologies if I'm not getting stack-overflow formatting right, I'm pretty much still a beginner.

p.s. I read the similar question, but A) had nothing in the html, and wasn't directly related to ng-repeat

further Clarification of question (if needed): how could a component which runs the $interval call different components ng-repeated object's function.

You say you're trying out angular 1.5 but have 1.2.23 in your script tag. — Matt Sugden, Jul 27 '16 at 08:09
That was inserted by the code snippet program, as I said, I don't know how to set stack-overflow's formatting correctly. — BaneStar007, Jul 27 '16 at 08:19
I'm trying to figure out why you would need to call a function on a child-component? — Pjetr, Jul 27 '16 at 08:33
@Pjetr In my larger code, each component has its own logic, and builds its own html attributes based on that logic, but the interval is supposed to trigger those attributes, I stripped out anything unrelated when I was looking for the error, and found that I was just unable to run the child function at all.. where is obj? how can the runList function access obj to run its function.. — BaneStar007, Jul 27 '16 at 08:43
This answer seems to be going down the path, but doesn't deal with repeatable components http://stackoverflow.com/questions/36033940/how-to-pass-data-between-child-components-in-angular-1-5-not-using-scope/36035086#36035086 — BaneStar007, Jul 28 '16 at 03:00

score -1 · Answer 1 · answered Jul 27 '16 at 08:25

-1

Add $interval to your controller dependencies

answered Jul 27 '16 at 08:25

Matt Sugden

844
6
12

For the purposes of this site/plunker, I added the missing $interval to the above code.. mistake on my behalf as my own code has the $interval.. – BaneStar007 Jul 27 '16 at 08:30
I think you've got things the wrong way round. A controller shouldn't be calling an action on a component (or directive). The mark down is a bit excessive, you linked to a plunker that didn't work, which I told you about. – Matt Sugden Jul 27 '16 at 08:48
while the code snippet above is unable to do Angular 1.5, I made sure the Plunker had 1.5.5. – BaneStar007 Jul 27 '16 at 09:00
As of 1.5 controllers are no longer needed, so this can be a component calling a component, same deal, how could a component which runs the $interval call a ng-repeated object's function. – BaneStar007 Jul 27 '16 at 09:02
It's not the same deal. A component is just another form of directive, whereas a controller is a controller. – Matt Sugden Jul 27 '16 at 09:12

Angular 1.5, calling a components function from outside an ng-repeat?

1 Answers1