小编Jon*_*y-Y的帖子

$ parent vs call在父子指令通信中的最佳方法

我试图了解什么是最好的GENERIC方法在父和子指令之间进行通信与隔离范围(它们可能是可重用的项目).

这意味着如果child指令需要以某种方式更新父指令(两者都有隔离的作用域),我应该传递一个回调函数:

例如:

.directive('filterReviewStepBox', function () {
    return {
        restrict: 'EA',
        scop: {
            //some data
        },
        template: '<div>text<reusable-dir></reusable-dir call-back="foo"></div>',
        link: function (scope, elem, attrs) {
            scope.foo = function () {
                console.log('bar');
            };
        }
    };
}).directive('reusableDir', function () {
    return {
        restrict: 'EA',
        scope: {
            callBack: '=callBack'
                //other data
        },
        template: '<div>text<button type="button" ng-click="bar"></button></div>',
        link: function (scope, elem, attrs) {
            scope.bar = function () {
                scope.callBack();
            }
        }
    };
});
Run Code Online (Sandbox Code Playgroud)

或者我应该使用$ emit():

例如:

  directive('filterReviewStepBox', function () {
        return {
            restrict: 'EA', …
Run Code Online (Sandbox Code Playgroud)

emit angularjs angularjs-directive

10
推荐指数
1
解决办法
1656
查看次数

Facebook Canvas,无法在移动设备上从Facebook登录

我有一个canvas facebook应用程序,它有一个网页和一个指定的移动页面.网页工作正常,当使用控制台模拟浏览器移动时,一切正常.

但是,当我尝试从Facebook移动应用程序运行应用程序时,画布应用程序加载(这是正确的),但它不登录.

我正在使用FB.login函数.

login: function () {
        var deferred = $q.defer();
        FB.login(function (response) {
            if (!response || response.error) {
                deferred.reject('Error occured');
            } else {
                deferred.resolve(response);
            }
        }, {
            scope: 'email, user_friends'
        });
        return deferred.promise;
    },
Run Code Online (Sandbox Code Playgroud)

并在设置>高级 - 我有:客户端OAuth登录,Web OAuth登录,嵌入式浏览器OAuth登录,有效的OAuth重定向URI和正确填写的设备登录.

但仍然从Facebook移动应用程序,画布应用程序不会预先登录.

我一直试图让这一整天都在工作.我无法在任何地方找到解决方案.我也无法调试移动Facebook应用程序.

任何想法如何处理这个问题?

编辑

还查看了我的节点服务器日志,我发现甚至没有调用FB.login.

编辑2

我最终用getLoginStatus替换了登录,这对我来说没有任何问题,因为它是一个Facebook画布应用程序...但问题仍然是如何登录.

编辑3 11/26/2015

那么getLoginStatus并没有完全解决我的问题,因为它实际上并没有记录用户所以对于画布游戏你可能需要登录第一个条目,如果你需要权限...我的解决方案是添加登录如果getLoginStatus像这样返回not_autorized:

        /**
     * [getLoginStatus get the FB login status]
     * @return {[type]} [description]
     */
    getLoginStatus: function () {
        var deferred = $q.defer();
        FB.getLoginStatus(function (response) {
            if (response.status === 'connected') {
                deferred.resolve(response); …
Run Code Online (Sandbox Code Playgroud)

javascript facebook canvas facebook-graph-api angularjs

8
推荐指数
1
解决办法
801
查看次数

具有shouldComponentUpdate与无状态组件的组件.性能?

我知道无状态组件使用起来要舒服得多(在特定情况下),但由于你不能使用shouldComponentUpdate,这是否意味着组件将为每个props更改重新渲染?我的问题是,使用具有智能的shouldComponentUpdate的类组件比使用无状态组件更好(性能方面).

就性能而言,无状态组件是否是更好的解决方案?考虑这个愚蠢的例子:

const Hello =(props) =>(
       <div>
           <div> {props.hello}</div>
           <div>{props.bye}</div>
       </div>);
Run Code Online (Sandbox Code Playgroud)

VS

class Hello extends Component{
    shouldComponentUpdate(nextProps){
        return nextProps.hello !== this.props.hello
    };
    render() {
        const {hello, bye} = this.props;
        return (
            <div>
               <div> {hello}</div>
               <div>{bye}</div>
           </div>
        );
    }
}
Run Code Online (Sandbox Code Playgroud)

让我们假设这些组件都有2个道具,只有其中一个我们想要跟踪和更新(如果是常见的用例),使用无状态功能组件或类组件会更好吗?

UPDATE

在做了一些研究之后我同意明确的答案.尽管类组件(使用shouldComponentUpdate)的性能更好,但似乎简单组件的改进可以忽略不计.所以我的看法是这样的:

  • 对于复杂组件,使用由PureComponent或Component扩展的类(取决于您是否要实现自己的shouldComponentUpdate)
  • 对于简单组件使用功能组件,即使它意味着重新运行
  • 尝试从最接近的类基本组件中减少更新量,以使树尽可能静态(如果需要)

performance reactjs

6
推荐指数
1
解决办法
1026
查看次数

TinyMCE添加动态自定义标签

我试图从CKEDITOR切换到TinyMCE并且我需要能够在源自定义动态标签中写入...例如:hightlight-123其中高亮 - 是静态的但是数字改变了......我查看了TinyMCE文档但是找不到任何方法来添加带有正则表达式的自定义元素或以字符串开头.

如何更改我的配置以允许使用某种正则表达式的自定义标签?

这是我的tinyMCE配置的相关部分:

 {
extended_valid_elements: 'highlight[style]',
        custom_elements: 'highlight'
}
Run Code Online (Sandbox Code Playgroud)

javascript tinymce angular-ui-tinymce

5
推荐指数
0
解决办法
135
查看次数