각도 스코프 변수를 Javascript에 전달

각도 스코프 변수를 Javascript에 전달

Angular scope 변수 streetName을 사용하고 있습니다.

<script type="text/javascript">
    angular.module('addApp').controller('add', ['$scope',function($scope) {
           $scope.streetName = "Bonita Ln";
    }]);
</script>

이 컨트롤러(추가) 범위에서 정의된 javascript에서 streetName에 접속하려면 어떻게 해야 합니까?제발 도와주세요.

<div ng-app="addApp" ng-controller="add">
StreetName: {{streetName}}

<script type="text/javascript">
//here i need to access the value of streetName...
</script>

</div>

이 방법은 길지만 효과가 있습니다.

    angular.element(document.querySelector('[ng-controller="add"]')).scope().streetName

가독성 향상:

    var dom_el = document.querySelector('[ng-controller="add"]');
    var ng_el = angular.element(dom_el);
    var ng_el_scope = ng_el.scope();
    var street_name = ng_el_scope.streetName;

jQuery를 사용하면 훨씬 더 짧습니다.

    var street_name = $('[ng-controller="add"]').scope().streetName;

jsfiddle 데모 링크

$window 서비스를 사용하는 공통 jsvar에 스코프 vat를 전달할 수 있습니다.

다음과 같이 합니다.

angular.module('addApp', [])
.controller('add', ['$window', function ($window) {
    ...
    $window.streetName = $scope.streetName; 
    ...
}

그 뒤에 js를 다음과 같이 comon js 코드에 첨부합니다.

<script type="text/javascript">
    document.write("\<script src='...' type='text/javascript'>\<\/script>");
</script>

그러나 이는 회피책일 뿐 최선의 해결책은 아니라는 점에 유의하십시오.

나도 비슷한 문제에 직면했다.일거리를 구했어요.그것은 나에게 잘 먹혔지만 그것이 올바른 접근법인지 확실하지 않다.

html에 숨겨진 입력 필드를 만들고 각도에서 값을 할당합니다.javascript에서 이 값에 액세스합니다.스크립트 태그에 도달했을 때 초기화되도록 스크립트태그 전에 작성해주세요.

다음과 같은 경우:

<div ng-app="addApp" ng-controller="add">
    StreetName: {{streetName}}
    <input type="hidden" id="dummyStreetName" value={{streetName}}>
    <script type="text/javascript">
        console.log("I got the street name "+$("#dummyStreetName").val());
    </script>
</div>

단순하고 복잡하지 않은 jQuery 솔루션:

HTML

<div id="data" data-street="{{streetName}}"></div>

자바스크립트

$(document).ready(function() {
    var streetName = $('#data').data('street');
});  

---

그$(document).ready...변수를 설정할 수 있는 각도 시간을 주는 것이 중요합니다.

Angular 11 / typescript 4.3.2에서는 이것을 ngOnInit에 추가함으로써 실행할 수 있었습니다.

window.localStorage.setItem("roundChartEdges","false")

그러면 내가 덮어쓰고 있던 javascript chartsjs 그리기 함수의 변수에 액세스할 수 있습니다.

Chart['elements'].Rectangle.prototype.draw = function () {
  console.log(window.localStorage.getItem("roundChartEdges"))
  ...
}

중요한 데이터를 저장하지 않는 경우라면 나쁘지 않은 솔루션입니다.

ngOnInit 함수에 정의된 변수를 사용하여 언제 막대 그래프 에지를 반올림할지 프로그래밍 방식으로 chartsjs에게 알려야 했습니다.

언급URL : https://stackoverflow.com/questions/17960622/pass-angular-scope-variable-to-javascript