Lodash를 Angular JS와 함께 사용하는 방법은 무엇입니까?
다음과 같이 lodash를 사용하여 ng-repeat
지시문 에서 사용하려고합니다 .
<div ng-controller="GridController" ng-repeat="n in _.range(5)">
<div>Hello {{n}}</div>
</div>
존재 GridController
:
IndexModule.controller('GridController', function () {
this._ = _
})
그러나 작동하지 않으므로 반복되는 것이 없습니다 . 지시문을 변경하면 ng-repeat="i in [1,2,3,4,5]"
작동합니다.
lodash
이미 통해 포함되어 <script>
에서 <header>
전 angular
. 어떻게 작동시킬 수 있습니까?
나는 '_'를 전역 적으로 소개하고 테스트를 위해 주입하는 것을 선호합니다.이 질문에 대한 대답을 참조하십시오. 컨트롤러 내부에서 밑줄 사용
var myapp = angular.module('myApp', [])
// allow DI for use in controllers, unit tests
.constant('_', window._)
// use in views, ng-repeat="x in _.range(3)"
.run(function ($rootScope) {
$rootScope._ = window._;
});
@beret 및 @wires의 답변에 대한 설명을 추가하고 싶었습니다. 그들은 확실히 돕고 그것에 대한 요점을 얻었지만 전체 프로세스를 순서대로 얻는 것이 누군가에게 적합 할 수 있습니다. 이것이 lodash로 앵귤러 환경을 설정하고 yeoman gulp-angular로 제대로 작동하도록하는 방법입니다.
bower install lodash --save
(이것은 bower에 추가되고 bower json에 저장됩니다)angular가 수행하기 전에 lodash로드를 갖도록 bower json을 수정하십시오. (이것은 gulp inject를 사용하고 수동으로 index.html에 넣지 않으려는 경우 도움이됩니다. 그렇지 않으면 각도 링크 앞에 index.html에 넣으십시오)
@wires의 방향에 따라 새로운 상수를 만드십시오.
'use strict'; angular.module('stackSample') // lodash support .constant('_', window._);
- 다른 서비스와 마찬가지로 각도 서비스, 필터 또는 컨트롤러에 주입합니다.
.filter('coffeeFilter', ['_', function(_) {...}]);
- 각도 HTML 뷰에 던져 넣으려면 컨트롤러에 주입하고 범위 변수를 할당하십시오.
.controller('SnesController', function ($scope, _) { $scope._ = _; })
누군가가 자신의 사이트를 설정하는 데 도움이되기를 바랍니다. :)
ng-repeat
Angular 범위 변수에 대한 액세스 권한이있는 Angular 표현식이 필요합니다. 그래서 대신 할당 _
을 this
받는 할당, $scope
당신이 컨트롤러에 주입 목적 :
IndexModule.controller('GridController', function ($scope) {
$scope._ = _;
})
사용중인 Angular 버전이 무엇인지 잘 모르겠습니다. 'this'를 사용하여 dom의 변수에 액세스 할 때 'Controller as'구문을 사용 했어야하는 것 같습니다.
다음은 범위를 사용하지 않는 솔루션입니다. http://plnkr.co/edit/9IybWRrBhlgQAOdAc6fs?p=info
<body ng-app="myApp" ng-controller="GridController as grid">
<div ng-repeat="n in grid._.range(5)">
<div>Hello {{n}}</div>
</div>
</body>
참고 URL : https://stackoverflow.com/questions/23862119/how-to-make-lodash-work-with-angular-js
'developer tip' 카테고리의 다른 글
하이 차트 차트에서 모든 계열 데이터를 제거하는 올바른 방법은 무엇입니까? (0) | 2020.11.16 |
---|---|
Express.js-헤더가 이미 전송되었는지 확인하는 방법은 무엇입니까? (0) | 2020.11.16 |
모든 개발자가 알아야 할 기본적인 명확한 개념은 무엇입니까? (0) | 2020.11.16 |
jQuery의 keydown () 이벤트 핸들러에서 누른 문자를 디코딩하는 방법 (0) | 2020.11.16 |
gradle의 versionNameSuffix에 날짜 빌드를 추가하는 방법 (0) | 2020.11.16 |