Функция AngularJs доступна для всего приложения

Я создаю приложение в AngularJs, и я столкнулся с ситуацией, когда мне нужно вызвать одну и ту же функцию в нескольких представлениях.Функция AngularJs доступна для всего приложения

В этом случае это система магазинов, в которой один и тот же магазин может быть виден во множестве видов. В доме, если он находится рядом с пользователем, в платной рекламе, в результатах поиска и т. Д.

Я знаю, что эта функция должна быть в сервисе, который я уже сделал. Но возникает вопрос: как мне вызвать эту функцию из представления/html?

Я бы хотел избежать повторного определения одного и того же вызова снова и снова в нескольких контроллерах, но до сих пор не нашел ничего, связанного с этой конкретной проблемой.

Это код, у меня есть:

function mainFactory($http) { 
    var service = { 
     addFav: _addFav 
    }; 
    return service; 

    function _addFav(data, func) { 
     return $http.post(baseUrl+func,data).then( 
      function(res) {return res.data;}, 
      function(err) {alert(_errorMsg);} 
     ); 
    }; 
} 

function HomeController() { 
    vm.addFavorites = addFavorites; 
    function addFavorites(data) { 
     var func = 'function_name'; 
     mainFactory.addFav(data,func); 
    } 
} 

function AdvController() { 
    vm.addFavorites = addFavorites; 
    function addFavorites(data) { 
     var func = 'function_name'; 
     mainFactory.addFav(data,func); 
    } 
} 

function SearchController() { 
    vm.addFavorites = addFavorites; 
    function addFavorites(data) { 
     var func = 'function_name'; 
     mainFactory.addFav(data,func); 
    } 
}

Как вы можете видеть, мне нужно вызвать ту же функцию в нескольких контроллерах.

Я уже видел несколько других примеров, говорящих, что эта функция используется как функция $ rootScope из .run, но также и предупреждение о том, что не является хорошей практикой для определения функций как функций root.

Любое предложение о том, как это решить?

Edit:

Другое решение я использую прямо сейчас, чтобы иметь «MainController», определенный в теге тела через директивы, так что я могу использовать эту функцию во всем приложении. Но этот контроллер получает возможность сложного обслуживания, с множеством функций/процессов.

источник

2015-12-21 celsomtrindade

Http: // stackoverflow.com/questions/15025979/can-i-make-a-function-available-in-every-controller-in-angular – mrvol

Я не думаю, что сервис - это ответ, определить функцию в верхней части $ scope быть в порядке, $ scope.foo = function() {}, а затем использовать его в своем представлении, например, Tom

Мой вопрос другой, я уже видел эту тему. Но я хочу избежать повторного вызова функции в каждом контроллере. Я хотел бы определить его в одном контроллере и иметь возможность вызывать несколько видов. – celsomtrindade

Как я могу вызвать эту функцию из представления/html?

Вам не следует делать это непосредственно с точки зрения.

Но вы можете встраивать контроллеры в другие. Итак, если вы считаете, что ваша функция заслуживает «особого», вы можете иметь следующий «сценарий».

HTML:

<div ng-controller="appController as app"> 
    <div ng-controller="HomeController as home"> 
     <button ng-click="app.addFavorites();"></button> 
    </div> 

    <!-- ... --> 
</div>

Это может также работать с SPA, если вы кладете AppController от "внутреннего зрения". Не стесняйтесь дать этому «appController» другое имя (мой сосать немного).

источник

2015-12-21 15:39:41

Предположим, у вас есть приложение, как, что:

<html ng-app="app"> 

<body ng-controller="MainController"> 

<div ui-view></div> 

</body> 
</html>

И тогда у вас есть приложение, как:

angular.module('app', ['app.models']).controller('MainController', MainController); 

function MainController($scope, MyService) { 

    $scope.addToFav = function (data) { 

     // suppose data is object 
     // then 

     MyService.add({ 
      url: "...", 
      data: data 
     }).then(function(result) { 

      // success 

     }).catch(function(error) { 

      // wrong 

     }); 
    } 
} 

// this is a service, shared by controller 
(function (angular) { 

    'use strict'; 

    angular.module('app.models') 
     .factory("MyService", _model); 

    _model.$injector = ['$http']; 

    function _model($http) { 

     var service = { 
      all: all, 
      one: one, 
      update: update, 
      add: add, 
      remove: remove 
     }; 

     return service; 

     function add(param) { 

      var url = param.url; 

      if (url === null) { 
       return null; 
      } 

    $http({ 
     url: url, 
     method: 'POST', 
     data: $httpParamSerializerJQLike(param.data), 
     headers: { 
      'Content-Type': 'application/x-www-form-urlencoded' 
     }).then(function (result) { 
       return result; 
     }); 
    } 
})(angular);

Затем вы можете использовать MyService в любом из контроллера, и вы можете использовать addToFav для любой из ваших просмотров в одном приложении ...

<a ng-click="addToFav(...)"></a>

Если вы относитесь о проблеме заворота из MainController, лучший способ это использовать локальный контроллер в качестве виртуальной машины:

function ExampleController($scope, Product) { 

    var vm = this; 

    vm.product = ProductComponent.singleton($scope, Product) 

} 

var ProductComponet = (function() { 

    var instance; 
    var scope; 

    return { 
     singleton: function (_scope, Model) { 

      scope = _scope; 

      if (!instance) { 
       instance = createInstance(Model); 
       console.log(instance); 
      } 

      console.log(instance); 

      return instance; 
     } 
    }; 

    function createInstance(Model) { 

     var vm = { 
     item: {}, 
     list: [], 
     addToFav: addToFav 
     }; 

     return vm; 

     function addToFav() { 

     } 
    } 
})();

Затем на ваш взгляд, вы можете использовать:

VM. product.item для доступа к текущему элементу

vm.product.list, чтобы получить доступ всех элементов

Храните все связанные данные и методы в одном компоненте и повторно используйте его в другом контроллере.

Тогда почему бы не использовать угловую службу или завод, потому они все синглтон, да, мы можем использовать оба, идея заключается в том, чтобы создать компонент, и повторно использовать его, а не просто использовать контроллер

источник

2015-12-21 15:55:23 Tom

Это то, что у меня есть на момент. Но в моем случае у меня есть несколько сегментов, мне нужно сделать то же самое. Поэтому мой MainController становится все больше и имеет множество функций. Поэтому я с нетерпением жду, чтобы оптимизировать это. Но это отличный способ сделать, если я не найду другого решения – celsomtrindade

Функция AngularJs доступна для всего приложения

ответ

Смежные вопросы