0

I'm a beginner at Angularjs and I would like to know how can I use javascript built-ins like Date or Array in expressions. It seems weird to add them like this $scope.Array = Array in every controller.

Ella Sharakanski
  • 2,683
  • 3
  • 27
  • 47
  • 1
    Why would you add them to the scope like that anyway? Why would you need those things in your expressions? Seems like that's doing work in the view that's probably unnecessary. – Dave Newton Nov 28 '14 at 16:34
  • I'd like to have a function that does exactly what Date does and another function that does exactly what Array does. Those functions are pretty useful. – Ella Sharakanski Nov 28 '14 at 16:36

1 Answers1

0

Edit: In response to your comment below, I would just add a little change to the way you have done it as I personally like to remove as much logic as possible from the view.

JavaScript

$scope.numItems = 5;
$scope.range = Array($scope.numItems);

HTML

<tr ng-repeat="i in range track by $index">
    <td align="center">{{$index}}</td>
camden_kid
  • 12,591
  • 11
  • 52
  • 88
  • But it's weird, adding it to every controller. Code duplication. Doesn't seem very angularjs to me. Also, I wanted the funtions Date and Array, not instances. So that in the expression I can write {{Array(5)}} and {{Date()}} or maybe {{Date(2013, 0, 1)}} (in this case it should call new Date(2013, 0, 1) with "new"). The Array example is useful for
  • – Ella Sharakanski Nov 28 '14 at 16:43
  • @Ella Shar But if you write {{Array(5)}} what does 'Array' refer to? Never mind AngularJS, what does Array(5) in JavaScript mean? Wouldn't you normally write var arr = [...]; var x = arr[5]? – camden_kid Nov 28 '14 at 16:49
  • Array(5) creates an empty array of length 5. This is useful in angularjs for iterating over to duplicate something a given number of times. – Ella Sharakanski Nov 28 '14 at 16:52
  • try this `{{Date(2013, 0, 1) | date}}`, you can use built in's without having to define them on $scope – harishr Nov 28 '14 at 17:15
  • @EllaShar Sorry, I meant what would Array(5) contain? It is empty so {{Array(5)}} doesn't make sense, especially as {{}} should be accessing an element of the array. – camden_kid Nov 28 '14 at 17:16
  • @harish I wrote

    {{Date(2013, 0, 1) | date}}

    and the page was blank.     – Ella Sharakanski Nov 28 '14 at 23:35
  • @camden_kid I now have a controller with `$scope.range = Array;` in it. In the scope of that controller, I do `` and it creates a loop of 10. So I can do `{{$index}}` inside to give a number to each row. – Ella Sharakanski Nov 28 '14 at 23:39
  • That's nice but not really what I asked for. I want a function that can be used over many controllers. Also I'm not sure if removing that much logic is good, the HTML should be indicative. What do you think, since I'm just a beginner? – Ella Sharakanski Nov 29 '14 at 10:57
  • 1
    @EllaShar I think I understand now. You should use a service that you can inject into any controller - https://docs.angularjs.org/guide/services. I still think one should remove all logic from the view as this complies with the MVC principles of AngularJS. – camden_kid Nov 29 '14 at 11:09
  • And then I'll have to inject that service to every controller and use something like $scope.range = myService? I thought about that but for a task as simple as "$scope.Array = Array" a service is too much. Isn't there a way for me to only inject once? – Ella Sharakanski Nov 29 '14 at 13:31
  • 1
    @EllaShar You can just use myService without assigning it to a variable, e.g. myService.myFunc(). The other option would be to create a function on $rootScope, e.g. $rootScope.myFunc = function(); You can then inject $rootScope and use $rootScope.myFunc(). Lastly, if you really don't want to inject you could just create a global JavsScript function. – camden_kid Nov 29 '14 at 13:35
  • @camden_kid I declared the following service: `.service('ser', function(){this.range = Array;});` and then used it: `ser.range(5)`. It works when I inject it and assign it to `$scope` in the controller but it doesn't work if I don't. creating a function on `$rootScope` works, thanks! without any injection, I just added `app.run(function($rootScope){$rootScope.range = Array;});` Is this an "angularjs" way or is it ugly? Also I tried creating a global JS function and it didn't work, are you sure I can access a global function from the HTML? Thanks a lot! – Ella Sharakanski Nov 29 '14 at 17:45
  • Just saw this answer http://stackoverflow.com/questions/15025979/can-i-make-a-function-available-in-every-controller-in-angular which is really helpful – Ella Sharakanski Nov 29 '14 at 17:46
  • @EllaShar I think that question and the answers is what you are looking for. I prefer not to use $rootScope as it is like creating global variables/functions. You may want to delete this question. It will remove my answer but that's not a problem. – camden_kid Nov 29 '14 at 20:34
  • I don't see a reason to deleted it, I googled before asking and since I didn't really know what to ask, I got no answers. And maybe someone will have the same question as mine, who knows. Thanks again – Ella Sharakanski Nov 29 '14 at 20:58