javascript - How to get angularjs variable value to other .js file - Stack Overflow

admin管理员组

文章数量:1391974

I am new to angularjs. I want to get angularjs variable to other js file. My angular js file code is...

  angular.module('myApp.menu', ['myApp.cloverApi', 'myApp.preOperation'])
    .controller('popMenuCtrl', ['$scope', '$http', '$routeParams',  'category', 'order', 'init', 'mInfoService', 'preop', 'mobileDetector', function($scope, $http, $routeParams, category, order, init, mInfoService, preop, mobileDetector) {
 mInfoService.init($scope.errorCallback)
                .success(function (data) {
                    $scope.merchant.shopName = $scope.capitalizing(data.name);

I want to get merchant.shopName to other js file so how can i get this variable value. and my html file code.

 <span ng-show="!isMerchant">{{merchant.shopName}}</span>

I want to catch this variable in script file as below

<script>
addToHomescreen({
    message: 'Add {{merchant.shopName}} to Your Phone, tap %icon, then <strong>Add to Home Screen </strog>',
    displayPace: 0
    });
</script>

but is not working

I am new to angularjs. I want to get angularjs variable to other js file. My angular js file code is...

  angular.module('myApp.menu', ['myApp.cloverApi', 'myApp.preOperation'])
    .controller('popMenuCtrl', ['$scope', '$http', '$routeParams',  'category', 'order', 'init', 'mInfoService', 'preop', 'mobileDetector', function($scope, $http, $routeParams, category, order, init, mInfoService, preop, mobileDetector) {
 mInfoService.init($scope.errorCallback)
                .success(function (data) {
                    $scope.merchant.shopName = $scope.capitalizing(data.name);

I want to get merchant.shopName to other js file so how can i get this variable value. and my html file code.

 <span ng-show="!isMerchant">{{merchant.shopName}}</span>

I want to catch this variable in script file as below

<script>
addToHomescreen({
    message: 'Add {{merchant.shopName}} to Your Phone, tap %icon, then <strong>Add to Home Screen </strog>',
    displayPace: 0
    });
</script>

but is not working

• javascript
• angularjs

Share Improve this question Follow edited Nov 15, 2014 at 7:06 Harsh Gandhi asked Nov 15, 2014 at 6:03 Harsh GandhiHarsh Gandhi 5933 silver badges1111 bronze badges 1

• Using Angular, it's very unmon to see anything in <script> tags like this. Instead, using factories to hold data that gets municated through html via scopes is standard procedure, i think. Where is merchant.shopName being generated from and where do you want it to go? – irth Commented Nov 15, 2014 at 9:59

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

This a good use-case for an angular service.

In another file, you create a service like this:

angular.module('app').factory('factoryName', function(){
// create factory object
    var data = {};
    data.someProperty = 'Some Property';
    data.someMethod = function(){
        console.log('Service Method');
    }
// return the factory object
    return data;
})

Now that you have created your 'factoryName' service, inject it into a controller and scope it for your view.

angular.module('app').controller('YourCtrl', function($scope, factoryName){
    $scope.fromService = factoryName;
});

You're just about done. You'll of course need to reference the .js file in your index.html and finally use it in your html template, for example:

<div ng-controller="YourCtrl">
    <input ng-model="fromService.someProperty"/>
    <button ng-click="fromService.someMethod()">Console Log</button>
</div>

Please let me know if you'd like a Plnkr example.

Whatever data you wanna use through out your application than you must use $rootScope

In your case:

angular.module('myApp.menu', ['myApp.cloverApi', 'myApp.preOperation'])
.controller('popMenuCtrl', ['$scope', '$http', '$routeParams',  'category', 'order',     'init', 'mInfoService', 'preop', 'mobileDetector', function($scope, $http, $routeParams, category, order, init, mInfoService, preop, mobileDetector) {
mInfoService.init($scope.errorCallback)
            .success(function (data) {
                // Here is the change
                $rootScope.merchant.shopName = $scope.capitalizing(data.name);

and then in your html

<span ng-show="!$rootScope.isMerchant">{{$rootScope.merchant.shopName}}</span>

本文标签： javascriptHow to get angularjs variable value to other js fileStack Overflow