-1

I have an Javascript Array which holds values. I want that Array to be the source that Angular reads off to update the UI. But i how do i access it from Angular?

Like:

<script>
var myArr = ["apple", "banana", "cherry"];
/**
 * then all Angular stuffs here...
 */
</script>

<div ng-controller="myController">
    <ul>
        <li ng-repeat="i in what?">
           {{ i }}
        </li>
    </ul>
</div>

Of course i can build an Array in Angular scope. But anyway, how do i access the Javascript Array instead?

Improve this question
1

5 Answers 5

Reset to default
2

Assuming the var is on the window (got if from an external source), you can inject $window to your controller and fetch it.

// Controller

function($scope, $window) {
   $scope.myArr = $window.myArr;
}

// View:

<div ng-controller="myController">
    <ul>
        <li ng-repeat="i in myArr">
            {{ i }}
        </li>
    </ul>
</div>

JSFIDDLE.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

2

You need to set the variable on the $scope on the associated controller. If the array comes from "outside" Angular, simply do this:

myApp.controller('myController', function ($scope, $window) {
    $scope.myArr = $window.myArr;
});

Now myArr is available in your template.

Improve this answer

Comments

2

I have an Javascript Array which holds values. I want that Array to be the source that Angular reads off to update the UI.

Well, you cannot should not. You should move that in your angularjs controller. Thats because anything you write within <script> tag would be out of angular's context.

Simply move the array to controller

myApp.controller('myController', function($scope) {
    $scope.myArr = ["apple", "banana", "cherry"];
});

UPDATE: [After discussion with @Cerbrus in comments below]

As answered by @deceze and @Amir, its doable by injecting the $window service in controller and creating a similar array in angular's context. Also, just because something is doable doesnt mean you should go for it. 

function($scope, $window) {
   $scope.myArr = $window.myArr;
}
Improve this answer

10 Comments

You can.
@Cerbrus . Bud did you see the OP code? he had only script tag, he doe's not configure any angular basics. so I explained you can't. That is wrong?
@RameshRajendran: He's saying the OP can't use that array he already has. That's simply not true, that specific array can be used.
@Cerbrus . Okay I agree with you. But tell me a solution for if I using Same array name(myArr ) in different js file, then how can i get the array (myArr ) in mycontroller??? if we use angular array, then that is a better way to js array
okay cool. The OP does dot explain well, we have answering by OP code. That's all buddy... forgive me, If my explanation is wrong. :)
|
1

Yes you can do it.

But If you want to do this, you need configure lot of things...

.... Call angular scripts

..... route specifications

..... learned about MVC architecture with using angular.js

..... And angular variables

So please Learn here

Read this article

Improve this answer

7 Comments

You can.
@Cerbrus . Bud did you see the OP code? he had only script tag, he doe's not configure any angular basics. so I explained you can't. That is wrong?
You're saying the OP can't use that array he already has. That's simply not true, that specific array can be used.
I agree with @RameshRajendran. Also, just because something is doable doesnt mean it is a good practice
If it's a bad practice, explain that it is. But don't tell people something isn't possible when it clearly is.
|
0

You should set myArr to $scope instead of var myArr.

Replace var myArr to $scope.myArr and put it inside the controller.Simple as it is

Improve this answer

2 Comments

Without a controller, that's not going to work.
Of Course .You need a controlller

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.