小编Dan*_*ell的帖子

在Angular中加载页面后滚动到锚点

我需要设置一个ng-click事件,以便它加载一个新页面,然后,一旦页面加载,滚动到页面上的一个锚点.我已经尝试过在这个SO帖子上提出的每个解决方案,但我无法让它正常工作.

大多数解决方案都围绕滚动到已加载的页面上的锚点.我需要在加载新页面后进行滚动.

这是我的观看代码:

<div class="see-jobs-btn" ng-click="$event.stopPropagation();goToResultJobs(r)">See Jobs</div>
Run Code Online (Sandbox Code Playgroud)

这表示"个人资料卡"中的按钮.当用户点击卡片时,它会将他们带到个人资料页面.但是,当他们单击按钮时,需要将它们带到该配置文件页面的#jobs部分(因此代码中的goToResultJobs(r)之前的$ stopPropogation()).

这是我的goToResultJobs方法的样子.

$scope.goToResultJobs = function(result) {
    var profileUrl = result.slug;
    window.location = profileUrl;
};
Run Code Online (Sandbox Code Playgroud)

我已经尝试过使用$anchorScroll并且只是在锚中硬编码profileUrl,但是没有人工作.我对Angular很新,所以我不知道我在这里缺少什么.

更新1:尝试使用$ timeout

这是我goToResultJobs在ResultsCtrl中的方法,当用户单击按钮时触发该方法:

$scope.goToResultJobs = function(result) {
    var url = window.location + result.slug + '#jobs';
    location.replace(url);
};
Run Code Online (Sandbox Code Playgroud)

加载/name#jobs路径,调用下面的ProfileCtrl:

app.controller('ProfileCtrl', ['$scope', '$http', '$timeout', '$location', '$anchorScroll',
function($scope, $http, $timeout, $location, $anchorScroll) {
    if(window.location.hash) {
        $timeout(function() {
            console.log('TEST');
            // $location.hash('jobs');
            // $location.hash('jobs');
            $anchorScroll();
        }, 1000);
    };
}]);
Run Code Online (Sandbox Code Playgroud)

此设置似乎有效,因为TEST仅在单击"作业"按钮时出现在控制台中,而不是在用户单击该配置文件时出现.我现在面临的问题是页面开始加载,并且网址栏中的路径更改为 …

angularjs anchor-scroll

19
推荐指数
2
解决办法
2万
查看次数

隐藏仅在Windows上显示的无用滚动条

我的导航栏中有一个引导下拉列表,显示了一个通知列表.这是非常标准的代码,但我设置max-height: 300px;overflow-y: scroll;开启ul元素.在Chrome或Firefox的Mac上查看时,在高度达到> 300px并且ul溢出滚动之前,没有滚动条.但是在Windows(Chrome或IE)上,垂直滚动条始终存在,这真的很烦人.有没有办法关闭Windows上的滚动条或隐藏它直到它实际需要?

以下是下拉列表的代码:

<li class="dropdown notifier">
    <div class="dropdown-toggle" style="width:initial;">
        <div class="dropdown-link nav-dropdown-link" id="dropdownMenuNotifications" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            <i class="fa" ng-class="unreadNotices > 0 ? 'fa-bell-o red' : 'fa-bell-o'" style="position:absolute;right:5px;"></i>&nbsp;
            <div class="counter" ng-if="unreadNotices > 0">{{unreadNotices}}</div>
        </div>
        <ul class="dropdown-items dropdown-menu account" aria-labelledby="dropdownMenuNotifications">
            <li>
                <a href="#" class="title"><span>Notifications</span></a>
            </li>
            <li ng-if="notices.length === 0">
                <a href="#" style="cursor:default;">
                    <div class="notice-text">
                        <span>No notifications at the moment</span>
                    </div>
                </a>
            </li>
            <li ng-repeat-start="n in notices" ng-if="!n.read">
                <a href="#" class="unread" ng-if="n.action" ng-click="markRead(n, …
Run Code Online (Sandbox Code Playgroud)

html css windows scrollbar

16
推荐指数
2
解决办法
1万
查看次数

npm install会生成大量错误

我必须在这个问题前面说,我是Angular和Node的新手.按照这个Tuts +教程的指示,我克隆了一个Angular回购样本,然后运行npm install.这产生了大量的错误,然后让我的终端悬挂了大约5分钟.之后,我运行npm start并打开了示例应用程序,它看起来运行得很好.

正如我所说的,我对Angular和Node很新,所以我不知道如何调试我看到的错误,或者甚至是我应该担心的问题.任何见解都会非常有帮助.谢谢!

npm install日志:https://gist.github.com/danielbonnell/30959bd15297f1f4ab43

?  angular-seed git:(master) npm install
npm WARN engine karma@0.10.10: wanted: {"node":"~0.8 || ~0.10"} (current: {"node":"0.12.2","npm":"2.7.5"})
npm WARN peerDependencies The peer dependency karma-jasmine@~0.1.0 included from karma will no
npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency
npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly.
npm WARN peerDependencies The peer dependency karma-requirejs@~0.2.0 included from karma …
Run Code Online (Sandbox Code Playgroud)

node.js npm angularjs

15
推荐指数
1
解决办法
1万
查看次数

LinkedIn分享帖子网址

我有一个应用程序,让人们发布内容到他们的LinkedIn页面.我想要做的是创建一个按钮,我可以将其包含在一封电子邮件中,点击该按钮后,会将用户发送到LinkedIn并打开该框以共享帖子.我想知道的是如何生成这个网址.结构是什么样的?到目前为止,我发现的所有信息都是关于如何在LinkedIn上分享到另一个网站的链接,而不是如何将用户引导到共享信箱.

示例链接:https://www.linkedin.com/share?id = 0123456789

LinkedIn

linkedin

13
推荐指数
4
解决办法
3万
查看次数

CSS nth-child在长度未知时选择除最后一个元素之外的所有元素

更新:我发布的小提琴链接现在有工作代码.:not(:last-child):nth-last-child(n + 2)这两个很好地工作.

我试图使用nth-childnth-last-child选择器选择每li一个ul除了最后一个.问题是,列表的长度可以从1到5个元素不等.我无法找到任何文档或如何实现此目的的示例.

这是以下HTML ul:

<ul class="breadcrumbs">
    <li>
        <a href="/">Home</a>
    </li>
    <li>
        <a href="/categories/1">Articles</a>
    </li>
    <li>
        <a href="/categories/6">Specials</a>
    </li>
    <li class="current">
        <a href="/categories/6/articles/21">Song Lyrics</a>
    </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

这是我目前的代码:

ul > li:nth-last-child(-1n+4) > a:hover {
  color: red;
}
Run Code Online (Sandbox Code Playgroud)

此代码仍然选择列表中的最后一个元素.我也试过下面的代码,但是没有选择任何东西.我也尝试了许多其他组合,但它们要么根本不起作用,要么选择最后一个元素.

ul > li:nth-child(1):nth-last-child(2) > a:hover {
  color: red;
}
Run Code Online (Sandbox Code Playgroud)

这是一个小提琴.

css css-selectors

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

Rails 4设计Omniauth,将多个提供者绑定到与用户关联的模型

我有一个关于如何处理集成设计的问题.我有两个型号CompanyUser.在我的情况下,用户将注册我的应用程序,然后呈现选项将应用程序连接到他们的不同帐户(Twitter,Facebook和LinkedIn),以便他们可以查看/创建帖子/推文/等.由于Company has_many Users社交媒体帐户属于公司,因此我希望Company使用另一个名为Provider存储凭据的模型将凭据绑定到模型,从而允许任何有权访问公司社交媒体帐户的用户.

我一直在关注如何配置多个omniauth提供程序的各种教程,但它们都专注于将它们绑定到用户模型并告诉我添加devise :omniauthable到我的用户模型.

如何制作Companyomn​​iauthable而不是用户?如果我不打算允许用户身份验证/注册视图omniauth,我是否甚至需要使我的模型无法实现?

这是我第一次构建社交媒体集成,所以我希望我的问题有道理.谢谢!

ruby-on-rails devise omniauth

7
推荐指数
1
解决办法
308
查看次数

Devise/OmniAuth覆盖默认的回调网址

我在Rails 4应用程序中使用Devise 3.5和Omniauth.我创建了与Facebook的集成,允许用户将他们的Facebook帐户连接到我的应用程序.目前,当用户点击连接按钮时,它们会被发送到/user/auth/facebook然后重定向到Omniauth生成的回调网址:/user/auth/facebook/callback.我想要做的是在某些情况下手动覆盖此回调网址 - 这意味着我不想在初始化程序中覆盖它 - 使用完全限定的URL.例如,如果用户开始使用,http://www.example.com/我可能希望覆盖默认的回调网址http://app.example.com/user/auth/facebook/callback.

我的应用程序具有动态子域,用户将(几乎)始终在子域上开始身份验证过程.不幸的是,Facebook似乎不支持oauth重定向网址中的通配符,这就是为什么我希望能够检测用户是否在子域中并将回调网址调整为我已在我的Facebook应用上列入白名单的内容以便授权过程成功.

根据我的阅读,url helper omniauth_authorize_path接受其他参数作为参数传递.我已经尝试过这样的自定义回调路径,但没有成功:

user_omniauth_authorize_path(:facebook, callback_path: @custom_callback)
Run Code Online (Sandbox Code Playgroud)

我也试过换callback_pathredirect_urlredirect_uri,但似乎没什么用.当我看到系统产生的链接,它确实有回调作为URL参数,但是当我点击链接,我重定向回默认的回调URL,而不是自定义回调URL.

facebook ruby-on-rails devise omniauth omniauth-facebook

7
推荐指数
1
解决办法
2314
查看次数

AngularJS承诺数组

任何人都可以帮我一些Angular的承诺吗?我有以下函数应该接受一个文件对象数组,迭代它们,并上传每一个.在每次迭代期间,promise对象被推送到一个数组promises.在我的upload函数中,我有一个附加的cycle函数,在.then()所有的promise对象都已解析之前不应该调用它.我认为我的代码看起来是正确的,但它无法正常工作.图像上传,但是cycle(files).then()会立即调用,而不是一旦promises数组结算.

function upload(files) {
    var uploadCount = files.length;
    function cycle(files) {
        var promises = [];
        for (var i = 0; i < files.length; i++) {
            var deferred = $q.defer();
            promises.push(deferred);
            var file = files[i];
            Upload.upload({
                url: '/photos.json',
                file: file
            }).success(function(){
                $scope.progressCurrentCount += 1;
                deferred.resolve();
            });
        };
        return $q.all(promises);
    };

    cycle(files).then(function(result) {
        if(uploadCount > 1) {
            $scope.lastAction = 'uploaded ' + uploadCount + ' photos';
        } else {
            $scope.lastAction …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-promise

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

Facebook应用程序与通配符Oauth重定向URL

我有一个我正在研究的Facebook应用程序.在我的应用程序的高级设置选项卡(在Facebook的开发人员网站中)中,我想指定一个带有通配符的OAuth重定向URL.我的应用的每个用户都有一个自定义子域(例如foobar.example.com).我希望能够指定OAuth重定向网址,例如*.example.com.我知道对于其他平台,例如Twitter和LinkedIn,可以通过将重定向URL简单地设置为example.com来实现这一点,并且它将接受包含任何子域的重定向URL www.在我的应用程序的常规设置选项卡中,我能够将URL更改app.example.comexample.com.执行此操作后,我仍然可以进行身份​​验证,app.example.com然后将其重定向回来,app.example.com/callback因为app.example.com/callback我的应用设置已列入白名单.如果我尝试从另一个子域进行身份验证,例如foobar.example.com,我被重定向回到app.example.com/callback事后,这不是我想要的.我尝试将我的重定向网址更改为example.com,就像我使用网站网址一样,但后来我重定向到example.com/callback而不是app.example.com/callback.我也尝试使用通配符*.example.com/callback,但Facebook不允许我在URL中使用通配符保存设置.

如何使我的重定向网址动态化,以便我无需手动输入数百甚至数千个列入白名单的网址?

facebook

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

FabricJS 中的高级捕捉

我根据这个问题中的例子来制作这个小提琴。这包括:

  • 角落捕捉
  • 边缘捕捉
  • 对象可以重叠
  • 对象完全包含在画布中
  • 对象的大小不能大于画布区域

这是代码:

window.canvas = new fabric.Canvas('fabriccanvas');
window.counter = 0;
var newleft = 0,
    edgedetection = 20, //pixels to snap
    canvasWidth = document.getElementById('fabriccanvas').width,
    canvasHeight = document.getElementById('fabriccanvas').height;

canvas.selection = false;
plusrect();
plusrect();
plusrect();

function plusrect(top, left, width, height, fill) {
    window.canvas.add(new fabric.Rect({
        top: 300,
        name: 'rectangle ' + window.counter,
        left: 0 + newleft,
        width: 100,
        height: 100,
        fill: 'rgba(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + …
Run Code Online (Sandbox Code Playgroud)

canvas fabricjs

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