草庐IT

UI模板

全部标签

javascript - 如何使用 Gulp 和 gulp-data 从单个 jade 模板生成多个 html 文件

我正在使用Gulp创建一个静态站点生成器.我想知道如何将每条数据(JSON)通过管道传输到一个jade模板中以生成多个html文件。这是gulp的"template"任务:gulp.task('templates',function(){'usestrict';varmyData=JSON.parse(fs.readFileSync('./_assets/data/content.json'));varmyPages=myData.pages;varmyPosts=myData.posts;gulp.src('./_assets/templates/index.jade').pipe(

javascript - jQuery UI Datepicker 显示不正确的周数

当使用jQueryUI日期选择器并从周日开始一周时,周数不正确。例如,2016年1月3日应该是第1周,因为所有日期(3日到9日)都在同一年。但正如您在下面的屏幕截图中所见,UI显示为第53周。这是呈现日期选择器的代码:$("#datepicker").datepicker({showWeek:true,firstDay:0});所以没有什么特别的,除了显示周数和从星期日而不是星期一开始一周(默认情况下)。这是问题的一个fiddle:https://jsfiddle.net/vLqabmmz/ 最佳答案 因为这看起来像是jQueryU

javascript - 带有 Jquery-ui slider 的 Angular2

我尝试将Jquery-uislider与angular2一起使用。我想让变量“slideValue”显示slider的值,但我不知道如何将我的模型或变量从Angular绑定(bind)到slider。这是我的slider组件:import{Component,ElementRef,Inject,OnInit}from'angular2/core';declarevarjQuery:any;@Component({selector:'slider',template:`slideValue={{slideValue}}`})exportclassSliderimplementsOnIni

javascript - 带有模板文字但没有括号的 ES6 调用函数

这个问题在这里已经有了答案:Backticks(`…`)callingafunctioninJavaScript(3个答案)关闭6年前。根据MDN,Taggedtemplateliterals可以按如下方式使用:vara=5;varb=10;functiontag(strings,...values){alert(strings[0]);//"Hello"alert(strings[1]);//"world"alert(values[0]);//15alert(values[1]);//50return"Bazinga!";}tag`Hello${a+b}world${a*b}`;//

javascript - 极简主义的微型 Javascript 模板系统?

我正在为javascript寻找一个极简主义的模板系统,alaJohnResig'sJavascriptMicroTemplating.越小越好,如果它是基于jquery的就更好了。推荐?我尝试了John的微模板,但遇到了一些问题,想看看是否有更多成熟/更好的打包解决方案。[更新]我再次尝试了Resig的微模板,它对我来说效果很好。仍然想听听其他替代方案(如果有的话)。 最佳答案 还有Mustache.js,它有一个简洁的语法IMO。 关于javascript-极简主义的微型Javasc

javascript - JQuery UI 可拖动 : Exceed containment on one side

我正在使用JQueryUI来实现可调整大小/可拖动的元素。现在我想为这些元素定义一个容器,以限制在三个(!)边上的调整大小/拖动。例如。看看这个JSFiddleexample.您可以看到包含的元素只能在父区域内调整大小/拖动。我想实现的是元素可以超出底部阈值并移动到父元素的底部边框之外。尽管如此,调整大小/拖动仍应限制在顶部、右侧和左侧,如父级相应边框所规定的那样。所以thismodification是我想出的://resizable/draggableoptionresize/drag:function(event,ui){expandParent("#parentElement",

javascript - Angular.js 使用 html2js 将指令与外部模板联合测试 - 无法加载模板

我正在尝试测试使用外部模板的指令。我尝试了以下所有解决方案,但没有成功:ng-directive-testingHowtotestdirectivesthatusetemplateUrlandcontrollers?AngularJS+Karma+Ng-html2js=>Failedtoinstantiatemodule...html我创建了一个测试指令(一个简单的div)并使用内联"template"和外部“templateUrl”对其进行了测试。内联解决方案有效,而外部解决方案无效:angular.module('AdUnit').directive('actionButton',

javascript - 没有任何UI框架的页面上的phonegap滑动过渡效果

目前我在phonegap响应式移动应用程序中工作。我没有使用jquerymobile或任何其他UI框架。我想在页面上滑动左/右过渡效果。我没有找到页面滑动过渡的正确解决方案。有人帮我解决这个问题,因为我不知道如何实现这种效果? 最佳答案 最后我得到了用于cordova(phonegap)应用程序的slidetransition插件。它适用于android和iphone。最适合没有任何UI框架的单页和多页应用程序。它支持滑动、翻转、淡入淡出和curl过渡。http://plugins.telerik.com/cordova/plugi

javascript - Angular UI Bootstrap Slider 每张幻灯片多个项目

我正在连接到Web服务,并希望为每张幻灯片填充4个项目的UIBootstrap轮播。我正在使用|limitTo:4,但我需要一种方法来限制总共10张幻灯片中的每张幻灯片4张。这是HTML{{event.title}}引用Controllerapp.controller("eventsController",function($scope,$http){varevents=$http.get('/events');events.success(function(data){$scope.eventData=data.events["event"];console.log($scope.e

javascript - 单个模板变量多次调用 meteor 助手

Tweets=newMeteor.Collection('tweets');if(Meteor.isClient){Meteor.subscribe('tweets');Template.Panel.helpers({items:function(){vardays_tweets=Tweets.find();console.log(days_tweets.count());returndays_tweets;});}if(Meteor.isServer){Meteor.publish('tweets',function(){returnTweets.find({},{limit:100