HTML:
def test
`mkdir c:\\opt\\CreateJSON\\#{params[:todo_text]}`
`mkdir c:\\opt\\CreateJSON\\#{params[:ddl3]}`
render 'test'
end
def show
render 'test'
end
控制器:
<div class="container">
<div>
<div ng-controller="LogPhoneMainController" ng-init="init()">
<div class="row">
<div class="col-sm-3 col-md-3 col-lg-3">
<h2>{{header}}</h2>
</div>
<div class="col-sm-offset-3 col-md-offset-3 col-lg-offset-3 col-sm-3 col-md-3 col-lg-3" >
<div ng-repeat="options in stopwatches|limitTo:1">
<div bb-stopwatch options="options">
<div class="container">
<div class="stopWatch">
{{options.elapsedTime | stopwatchTime}}
</div>
<div class="stopWatch-btn-con">
<button class="toggle-btn" ng-click="startStopTimer()">
{{startStop}}
</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-3 col-md-3 col-lg-3">
<input id="inbound" type="radio" name="content" value="inbound">
<input id="outbound" type="radio" name="content" value="outbound">
</div>
</div>
<hr />
<div class="row">
<div class="">
<div ng-view>
</div>
</div>
</div>
</div>
</div>
</div>
@Scripts.Render("~/bundles/stopwatch")
过滤
App.controller('LogPhoneMainController', ['$scope',
function LogPhoneMainController($scope) {
var self = this;
var togle = false;
$scope.header = "Log a phone call";
$scope.startStop = "Start";
$scope.stopwatches = [{ log: [] }, { interval: 1000, log: [] }, { interval: 2000, log: [] }];
}]);
指令:
App.filter('stopwatchTime', function () {
return function (input) {
if (input) {
var elapsed = input.getTime();
var hours = parseInt(elapsed / 3600000, 10);
elapsed %= 3600000;
var mins = parseInt(elapsed / 60000, 10);
elapsed %= 60000;
var secs = parseInt(elapsed / 1000, 10);
var ms = elapsed % 1000;
return hours + ':' + mins + ':' + secs + ':' + ms;
}
};
});
和我的工厂:
.directive('bbStopwatch', ['StopwatchFactory', function(StopwatchFactory){
return {
restrict: 'EA',
scope: true,
link: function(scope, elem, attrs){
var stopwatchService = new StopwatchFactory(scope[attrs.options]);
scope.startStopTimer = stopwatchService.startStopTimer;
scope.startTimer = stopwatchService.startTimer;
scope.stopTimer = stopwatchService.stopTimer;
scope.resetTimer = stopwatchService.resetTimer;
}
};
}])
当我点击我的按钮时,错误抱怨它无法定义$ scope,可以理解,因为我不知道如何将我的参数传递给stopStartTimer函数,然后设置名为stopStart的范围变量。
如何以正确的方式通过我的代码传递此参数?
答案 0 :(得分:0)
HTML
<div class="container">
<div>
<div ng-controller="LogPhoneMainController" ng-init="init()">
<div class="row">
<div class="col-sm-3 col-md-3 col-lg-3">
<h2>{{header}}</h2>
</div>
<div class="col-sm-offset-3 col-md-offset-3 col-lg-offset-3 col-sm-3 col-md-3 col-lg-3" >
<div ng-repeat="options in stopwatches|limitTo:1">
<div bb-stopwatch options="options">
<div class="container">
<div class="stopWatch">
{{options.elapsedTime | stopwatchTime}}
</div>
<div class="stopWatch-btn-con">
<button class="toggle-btn" ng-click="startStopTimer(startStop)">
{{startStop}}
</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-3 col-md-3 col-lg-3">
<input id="inbound" type="radio" name="content" value="inbound">
<input id="outbound" type="radio" name="content" value="outbound">
</div>
</div>
<hr />
<div class="row">
<div class="">
<div ng-view>
</div>
</div>
</div>
</div>
</div>
控制器代码:
App.controller('LogPhoneMainController', ['$scope','StopwatchFactory'
function LogPhoneMainController($scope,StopwatchFactory) {
var self = this;
var togle = false;
$scope.header = "Log a phone call";
$scope.startStop = StopwatchFactory.startStop;
$scope.stopwatches = [{ log: [] }, { interval: 1000, log: [] }, { interval: 2000, log: [] }];
}]);
指令代码
.directive('bbStopwatch', ['StopwatchFactory', function(StopwatchFactory){
return {
restrict: 'EA',
scope: {startStop='@'},
link: function(scope, elem, attrs){
var stopwatchService = new StopwatchFactory(attrs.options);
scope.startStopTimer = stopwatchService.startStopTimer;
scope.startTimer = stopwatchService.startTimer;
scope.stopTimer = stopwatchService.stopTimer;
scope.resetTimer = stopwatchService.resetTimer;
}
};
}])
工厂代码
.factory('StopwatchFactory', ['$interval', function ($interval) {
return function(options){
var startTime = 0,
currentTime = null,
offset = 0,
interval = null,
self = this;
if(!options.interval){
options.interval = 100;
}
options.elapsedTime = new Date(0);
self.running = false;
function pushToLog(lap){
if(options.log !== undefined){
options.log.push(lap);
}
}
self.updateTime = function(){
currentTime = new Date().getTime();
var timeElapsed = offset + (currentTime - startTime);
options.elapsedTime.setTime(timeElapsed);
};
self.startTimer = function(){
if(self.running === false){
startTime = new Date().getTime();
interval = $interval(self.updateTime,options.interval);
self.running = true;
}
};
self.stopTimer = function(){
if( self.running === false) {
return;
}
self.updateTime();
offset = offset + currentTime - startTime;
pushToLog(currentTime - startTime);
$interval.cancel(interval);
self.running = false;
};
self.resetTimer = function(){
startTime = new Date().getTime();
options.elapsedTime.setTime(0);
timeElapsed = offset = 0;
};
self.cancelTimer = function(){
$interval.cancel(interval);
};
self.startStopTimer = function (startStop) {
if (startStop === "Start") {
startTimer();
self.startStop = "Stop";
} else {
stopTimer();
self.startStop = "Start";
}
};
return self;
};
}]);