草庐IT

ng2-redux

全部标签

javascript - 文本编辑器的 Redux 架构 : dealing with coupled state

我正在使用React/Redux构建一个在某些方面类似于文本编辑器的应用程序。它不完全是一个文本编辑器,但它是相同的通用范例。有一个用于放置新项目的光标。可以添加、选择、删除项目等。我正在努力寻找一种符合redux精神的最佳方式来构建我的reducer。我有单独的状态切片来表示选择状态、文本本身、光标状态和其他设置。我认为“redux”方法是为每个状态切片设置缩减器,独立地改变状态以响应Action。然而,在文本编辑器中,这些状态片比乍看之下更加耦合。当你按下一个键时,有时会在光标所在的位置添加一个字母,并且光标会向前移动。但是,如果选择了文本,则将首先删除所选文本。如果您处于“插入”

javascript - redux-form onSubmit 刷新页面

我是redux-form的新手,在处理onSubmit时遇到了一个奇怪的问题。当我完全按照此处的redux-form示例设置我的项目时http://redux-form.com/6.7.0/examples/syncValidation/它按预期工作。我试图根据我的需要扩展这个示例,并确认它在加载表单时按预期工作,如下所示:路由组件>表单。当我尝试在通过路由(路由组件>容器组件>表单)加载的react组件中加载表单时,问题就出现了。当我点击提交时,字段值被添加到地址栏并且表单验证不运行。我已经尝试了我能想到的一切来解决这个问题。如果替换,下面提供的代码将正常工作与在index.js中。

javascript - 使用 Redux、React 和 react-router-dom 4.x 时从动态组件获取 ref

我有以下类(class)classMatchBoxextendsReact.Component{constructor(props){super(props);this.countdownHandler=null;this.showBlocker=true;this.start=this.start.bind(this);}start(){...}render(){...return(...);}};functionmapStateToProps(state){...}functionmatchDispatchToProps(dispatch){...}exportdefaultwit

javascript - Redux Saga navigator.geolocation.getCurrentPosition

我使用reduxsaga创建应用程序,但我遇到了地理定位问题。实际上我找到了解决方案,但我不明白它是如何工作的。functionuserPositionPromised(){constposition={}if(navigator.geolocation){navigator.geolocation.getCurrentPosition(location=>position.on({location}),error=>position.on({error}),{enableHighAccuracy:true})}return{getLocation:()=>newPromise(loc

javascript - angularjs ng-click 和 anchor 上的 href

如果anchor上同时存在ng-click和href,则ng-click不起作用。如果可能的话,我希望两者都能工作,转到一条路线然后运行一个功能。我的用例是我打开了一个带有链接面板的抽屉,当转到一个链接时我想关闭抽屉。让两者同时工作的简单方法是什么? 最佳答案 一旦您离开页面,脚本将不再运行。*你的流程可以是这样的:当用户点击时,运行执行以下操作的函数:运行你想要运行的原始函数处理任何“在此特定情况下导航离开”的逻辑。将location.href更改为您要导航到的URL。如果您发现自己一遍又一遍地实现那部分逻辑,当然可以将此行为提取

javascript - 在 ng-switch 中使用 ng-transclude

我无法让ng-transclude在ng-switch-default指令中工作。这是我的代码:指令:.directive('field',['$compile',function($complile){return{restrict:'E',scope:{ngModel:'=',type:'@',},transclude:true,templateUrl:'partials/formField.html',replace:true};}])partials/formField.html我是这样调用它的……test...产生错误的地方:[ngTransclude:orphan]Ille

javascript - 模板中带有 ng-if 的 angularjs 指令

我正在构建一个在其模板中使用ng-if的指令。奇怪的是提供给链接函数的元素并没有扩展ng-if代码,它只是ng-if的注释行。四处游玩,我发现通过将我的链接代码包装在$timeout中似乎可以让它工作,但我想知道这是否不是正确的方法......更重要的是,为什么会这样。我添加了一个plunk来演示:http://plnkr.co/edit/Gl7v8yJLevi664nUKcFY?p=preview 最佳答案 大多数指令实际上在$watch()中执行它们的大部分逻辑。例如ng-if将在它的属性上设置一个监视,然后在更改时渲染/删除d

javascript - Angular : How can I transclude an element into a template that uses ng-repeat?

我有一个carousel指令,其中包括一些分块,用于将传入的items数组映射到元素结构数组的数组中,然后生成类似于以下伪代码的标记:这个Angular模板看起来像这样:[elementshouldbetranscludedintothisspot.]鉴于我的View代码:tagshouldappearinsidethe'carousel.html'template'sng-repeatlist.-->{{item.name}}我希望嵌入的元素绑定(bind)到最深的ng-repeat的item对象完整的Plunker和简化的测试用例可在此处获得:http://plnkr.co/edi

javascript - 使用 ng-repeat 创建 AngularJS 表

我从数据库得到以下响应。关于类(class)数组,其中类(class)嵌套在组中,最后是学生。"Response":[{"Id":1,"Name":"Class1","Location":"Building1","Groups":[{"Id":1,"Name":"GB1","Students":[{"Id":1,"Name":"Mike","RollNo":"1","Performance":{"Id":1,"Math":"90","Physics":"70","English":"60"}},{"Id":2,"Name":"John","RollNo":"2","Performanc

javascript - ng-repeat:在点击时显示一个项目并隐藏其他项目

我有一个ng-repeat,它显示div列表,当我点击其中一个时,它会为点击的项目显示一个附加的div。这是有效的{{item.title}}{{item.content}}{{item.info}}我的项目是从一个包含项目列表的json加载的,每个项目在这个json中都有一个默认属性showfull设置为false。这是有效的,但现在我想在单击某个项目时隐藏列表中的所有其他项目。我尝试过这样的事情:这不起作用{{item.title}}{{item.content}}{{item.info}}在Controller中我添加了一个函数:$scope.expand=function(e)