AngularJs Beginner, how to call a function

时间:2022-02-26 16:00:53

I'm using for the first time AngularJS. I want to make a year scrollbar from 1960 to 2010. I need to recover the value of ng-bind, in order to call my function updateData(year) when I move the scrollbar. But I have a problem...

我第一次使用AngularJS。我想从1960年到2010年创建一年滚动条。我需要恢复ng-bind的值,以便在移动滚动条时调用我的函数updateData(year)。但我有一个问题......

I guess that the script is uncorrect. Can you help me?

我猜这个剧本不正确。你能帮助我吗?

<div ng-app>
    <input id='slider' type='range' min=1960 max=2010 ng-model='year' width=200>
    <span ng-bind='year'></span>
    <script>
    updateData({{year}})
    </script>
    <div id='' class='rChart datamaps'></div>  
  </div>

2 个解决方案

#1


1  

Html :

<div ng-app="myApp" ng-controller="personCtrl">
    <input id='slider' type='range' min=1960 max=2010 ng-model='year' width=200>
    <div>
        {{updateData()}}
    </div>
</div>

Js :

var app = angular.module('myApp', []);
app.controller('personCtrl', function($scope) {
    $scope.year = "2000";
    $scope.updateData = function() {
        return "Year : "+$scope.year;
    }
});

http://jsfiddle.net/28Lgcyoc/

#2


0  

Just call like {{updateData(year)}}. And make sure the updateData function is it in $scope in your controller. Then only you access in the view html part. Otherwise You Can't Use in html.

只需像{{updateData(year)}}一样打电话。并确保updateData函数位于控制器的$ scope中。然后只有你在视图html部分访问。否则你不能在html中使用。

<div ng-app>
    <input id='slider' type='range' min=1960 max=2010 ng-model='year' width=200>
    <span ng-bind='year'></span>
    {{updateData(year)}}
    <div id='' class='rChart datamaps'></div>  
  </div>

In Controller

$scope.updateData = function() {
   return 'Hello';
}

#1


1  

Html :

<div ng-app="myApp" ng-controller="personCtrl">
    <input id='slider' type='range' min=1960 max=2010 ng-model='year' width=200>
    <div>
        {{updateData()}}
    </div>
</div>

Js :

var app = angular.module('myApp', []);
app.controller('personCtrl', function($scope) {
    $scope.year = "2000";
    $scope.updateData = function() {
        return "Year : "+$scope.year;
    }
});

http://jsfiddle.net/28Lgcyoc/

#2


0  

Just call like {{updateData(year)}}. And make sure the updateData function is it in $scope in your controller. Then only you access in the view html part. Otherwise You Can't Use in html.

只需像{{updateData(year)}}一样打电话。并确保updateData函数位于控制器的$ scope中。然后只有你在视图html部分访问。否则你不能在html中使用。

<div ng-app>
    <input id='slider' type='range' min=1960 max=2010 ng-model='year' width=200>
    <span ng-bind='year'></span>
    {{updateData(year)}}
    <div id='' class='rChart datamaps'></div>  
  </div>

In Controller

$scope.updateData = function() {
   return 'Hello';
}