AngularJS - Lodash html капитализировать использование

Question

Я использую Lodash - angularJS.

_.capitalize('angularjs') from controller working for me. 

Output:Angularjs

И я использую переводчика. т.е. angularjs нагрузка от перевода

В главном контроллере получения текущего языка

var language = window.navigator.userLanguage || window.navigator.language; 
$translate.use(language); 

Использование ниже функции конфигурации

function configFunction($translateProvider) { 
    $translateProvider 
     .translations('en-US', { 
      angularjs: "angularjs", 
      java: "java" 
     }) 
     .translations('en-UK', { 
      angularjs: "angularjs", 
      java: "java" 
     }); 

    $translateProvider.preferredLanguage('en-US'); 
} 

angular 
    .module('angularjsApp') 
    .config(configFunction) 

Я хотел использовать это от HTML. Как я могу использовать?

Answer 1

создать фильтр, как это и использовать канал (|) в связывании

(function() { 
    'use strict'; 

    angular 
     .module('common', []) 
     .filter('capitalize', capitalize); 

    capitalize.$inject = []; 
    function capitalize() { 
     return capitalizeFilter; 

     //////////////// 
     function capitalizeFilter(text) { 
      return _.capitalize(text); 
     }; 
    } 

})(); 

и в HTML

<div>{{"angularjs" | capitalize}}</div> 

Working DEMO

Answer 2

Довольно смутный вопрос. Если я понимаю, то вы хотите отобразить выше в html, используя привязку данных Angular, т.е. привяжите переменную к вашему элементу html и запустите метод Lodash для этой переменной.

<div ng-app="myApp" ng-controller="myCtrl"> 
    Somevar: <input type="text" ng-model="myVar"> 
</div> 

<script> 
    var app = angular.module('myApp', []); 
    // load your Lodash module 
    app.controller('myCtrl', function($scope) { 
     // bind a dynamic variable to your html 
     $scope.myVar = _.capitalize('angularjs'); 
    }); 
</script> 

Answer 3

Я не рекомендую вам сделать это, вы должны передать значение результата в Вашей области, но если вам это нужно просто добавить в свой Lodash $ рамки, как это:

// controller 
 
$scope._ = _;

{{_.capitalize('angularjs') | translate}}

Answer 4

Вот полное решение

angular.module('app', ['pascalprecht.translate']) 
.config(function ($translateProvider) { 
    $translateProvider.translations('en', { 
    Angularjs: 'angularjs' 
    }); 
}) 
.constant('_', window._) 
.filter('capitalizeIt', ['_', function(_) { 
    return function(str) { 
     return _.capitalize(str) 
    } 
}]); 

Теперь на ваш взгляд

<h1>Hello {{'angularjs' | translate | capitalizeIt }}!</h1> 

Полная рабочая демо на plnkr