如何从 angularjs 指令调用 $scope 函数?
How to invoke $scope function from angularjs directive?
我知道 angularjs 但这是我第一次写 angular 指令所以每次我在控制器中收到消息时我都试图为进度条创建指令我正在计算字符串大小并使用以下代码将 progressbar.Problem 转换为字节,我看到错误 $scope.random
不是函数。知道实施错误的地方吗?
directive.js
angular.module("App").directive('progressBarCustom', function() {
return {
restrict: 'E',
scope: {
message: "="
},
templateUrl: '/view/partials/progressbar.html',
controller: function($scope) {
var data = $scope.message;
var currentFileBytes = [];
var currentBytesSum;
$scope.maxBytes = 3000;
getByteLen(data);
$scope.random = function(value) {
$scope.dynamic = value;
$scope.downloadPercentage = parseFloat((value / $scope.maxBytes) * 100).toFixed(0);
console.log('current value-dynamic', $scope.dynamic);
};
function getByteLen(normal_val) {
// Force string type
normal_val = String(normal_val);
currentFileBytes.push(byteLen);
currentBytesSum = currentFileBytes.reduce(function(a, b) {
return a + b;
}, 0);
$scope.random(currentBytesSum);
formatBytes(currentBytesSum);
return byteLen;
}
function formatBytes(bytes, decimals) {
var data = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
console.log('sum of all the bytes', data);
$scope.currentBytes = data;
}
}
}
});
progressbar.html
<uib-progressbar type="success" class="progress-striped" max="max" animate="true" value="dynamic"><span>{{downloadPercentage}}%</span></uib-progressbar>
main.html
<progress-bar-custom message="event"></progress-bar-custom>
controller.js
$scope.event = ["lorem ipsum","lorem ipsum"];
您在 $scope.random
分配之前调用 getByteLen
。
改用这个:
$scope.random = function(value) {
$scope.dynamic = value;
$scope.downloadPercentage = parseFloat((value / $scope.maxBytes) * 100).toFixed(0);
console.log('current value-dynamic', $scope.dynamic);
};
getByteLen(data);
我知道 angularjs 但这是我第一次写 angular 指令所以每次我在控制器中收到消息时我都试图为进度条创建指令我正在计算字符串大小并使用以下代码将 progressbar.Problem 转换为字节,我看到错误 $scope.random
不是函数。知道实施错误的地方吗?
directive.js
angular.module("App").directive('progressBarCustom', function() {
return {
restrict: 'E',
scope: {
message: "="
},
templateUrl: '/view/partials/progressbar.html',
controller: function($scope) {
var data = $scope.message;
var currentFileBytes = [];
var currentBytesSum;
$scope.maxBytes = 3000;
getByteLen(data);
$scope.random = function(value) {
$scope.dynamic = value;
$scope.downloadPercentage = parseFloat((value / $scope.maxBytes) * 100).toFixed(0);
console.log('current value-dynamic', $scope.dynamic);
};
function getByteLen(normal_val) {
// Force string type
normal_val = String(normal_val);
currentFileBytes.push(byteLen);
currentBytesSum = currentFileBytes.reduce(function(a, b) {
return a + b;
}, 0);
$scope.random(currentBytesSum);
formatBytes(currentBytesSum);
return byteLen;
}
function formatBytes(bytes, decimals) {
var data = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
console.log('sum of all the bytes', data);
$scope.currentBytes = data;
}
}
}
});
progressbar.html
<uib-progressbar type="success" class="progress-striped" max="max" animate="true" value="dynamic"><span>{{downloadPercentage}}%</span></uib-progressbar>
main.html
<progress-bar-custom message="event"></progress-bar-custom>
controller.js
$scope.event = ["lorem ipsum","lorem ipsum"];
您在 $scope.random
分配之前调用 getByteLen
。
改用这个:
$scope.random = function(value) {
$scope.dynamic = value;
$scope.downloadPercentage = parseFloat((value / $scope.maxBytes) * 100).toFixed(0);
console.log('current value-dynamic', $scope.dynamic);
};
getByteLen(data);