我正在尝试创建一个指令,该指令将使用与创建指令的元素相同的ng-model创建输入字段.
这是我到目前为止所提出的:
HTML
<!doctype html>
<html ng-app="plunker" >
<head>
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<link rel="stylesheet" href="style.css">
<script>document.write("<base href=\"" + document.location + "\" />");</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
This scope value <input ng-model="name">
<my-directive ng-model="name"></my-directive>
</body>
</html>
JavaScript的
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = "Felipe";
});
app.directive('myDirective', function($compile) {
return {
restrict: 'E',
scope: {
ngModel: '='
},
template: '<div class="some"><label for="{{id}}">{{label}}</label>' +
'<input id="{{id}}" ng-model="value"></div>',
replace: true,
require: 'ngModel',
link: function($scope, …我正在使用hammer.js,似乎我event.stopPropagation()不使用tap事件.
如果我单击该子项,则会触发相关事件,但也会触发父事件,我不希望这样.
$('#parent').hammer().bind('tap', function(e) {
$(this).css('background', 'red');
});????????
$('#child').hammer().bind('tap', function(e) {
e.stopPropagation();
$(this).css('background', 'blue');
});
这是一个例子:http://jsfiddle.net/Mt9gV/
我也试过jGestures,问题似乎是一样的.如何使用其中一个库实现此结果？(如果需要的话,还是另一个)
我需要在网站上显示新消息时播放声音.它适用于Chrome和Safari,但我无法在Safari移动设备上运行.我看到声音必须通过用户操作初始化,所以我尝试了:
var sound = new Audio('./path/to/my/sound.mp3');
var hasPlayed = false;
$('body').bind('click touchstart', function() {
sound.load();
});
sound.addEventListener('play', function() {
hasPlayed = true;
});
var playSound = function() {
if(hasPlayed) {
sound.currentTime = 0;
}
sound.play();
}
不幸的是,声音仍然没有播放.我也试过Buzz库,问题是一样的.
所以,问题是:如何在移动浏览器上以编程方式播放声音？
我有以下Sass占位符,我想扩展它.
%btn
// ...button styling...
&[disabled], &.btn--disabled
color: red
.btn-primary
@extend %btn
CSS输出如下:
[disabled].btn-primary, .btn--disabled.btn-primary{ color: red; }
当我想得到以下内容时:
.btn-primary[disabled], .btn-primary.btn--disabled { color: red; }
我不明白为什么输出顺序与指定的顺序不一样.我怎么能改变呢？
我使用单个Image模型来存储有关不同其他模型使用的图像的信息(通过多态关联).
我想根据相关的模型更改此模型上的上传器,以便为不同的模型提供不同的版本.
例如,如果imageable是a Place,则安装的上传器将是a PlaceUploader.如果没有PlaceUploader,那将是默认值ImageUploader.
目前我有:
class Image < ActiveRecord::Base
belongs_to :imageable, polymorphic: true
mount_uploader :image, ImageUploader
end
理想情况下,我希望:
# This is not supported by CarrierWave, just a proof of concept
mount_uploader :image, -> { |model| "#{model.imageable.class.to_s}Uploader".constantize || ImageUploader }
有没有办法实现这一目标？或者根据相关模型获得不同版本的更好方法？
我找到了另一种解决方案ImageUploader:
class ImageUploader < BaseUploader
version :thumb_place, if: :attached_to_place? do
process resize_to_fill: [200, 200]
end
version :thumb_user, if: :attached_to_user? do
process :bnw
process resize_to_fill: [100, 100] …javascript ×2
angularjs ×1
audio ×1
carrierwave ×1
css ×1
directive ×1
hammer.js ×1
jquery ×1
sass ×1