小编Mar*_*man的帖子

警告:清理不安全的样式值url

我想在我的Angular 2应用程序中的组件模板中设置DIV的背景图像.但是我在我的控制台中不断收到以下警告,但是我没有达到预期的效果......我不确定动态CSS背景图像是否因为Angular2中的安全限制或者我的HTML模板被破坏而被阻止.

这是我在控制台中看到的警告(我已将我的img网址更改为/img/path/is/correct.png:

警告:清理不安全的样式值url(SafeValue必须使用[property] = binding:/img/path/is/correct.png(请参阅http://g.co/ng/security#xss))(请参阅http:// g.co/ng/security#xss).

问题是我使用DomSanitizationServiceAngular2中的方法清理注入模板的内容.这是我在模板中的HTML:

<div>
    <div>
        <div class="header"
             *ngIf="image"
             [style.background-image]="'url(' + image + ')'">
        </div>

        <div class="zone">
            <div>
                <div>
                    <h1 [innerHTML]="header"></h1>
                </div>
                <div class="zone__content">
                    <p
                       *ngFor="let contentSegment of content"
                       [innerHTML]="contentSegment"></p>
                </div>
            </div>
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是组件......

Import {
    DomSanitizationService,
    SafeHtml,
    SafeUrl,
    SafeStyle
} from '@angular/platform-browser';

@Component({
               selector: 'example',
               templateUrl: 'src/content/example.component.html'
           })
export class CardComponent implements OnChanges {

    public header:SafeHtml;
    public content:SafeHtml[];
    public image:SafeStyle;
    public isActive:boolean;
    public isExtended:boolean;

    constructor(private …
Run Code Online (Sandbox Code Playgroud)

xss typescript angular

84
推荐指数
7
解决办法
10万
查看次数

如何连接到ASP.NET MVC中的现有数据库?

我刚刚开始学习C#和ASP.NETMVC,但我发现的每个例子都将数据库放在App_Data文件夹中.我不想这样做.

我想创建一个新版本的Nerd Dinner并将连接字符串移动到web.config,但我找不到任何关于如何操作的示例.我的数据库名为NerdDinner,我正在使用SQL Server Express.

将新连接字符串添加到我的Web配置的正确语法是什么?这对创建LINQ to SQL类有什么影响吗?

c# sql-server asp.net-mvc

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

JavaScript中的++ i和i ++有什么区别

在我学习和改进我的JavaScript的过程中,我遇到了一个带有switch/case语句的脚本,我注意到一些变量在++之前使用带有变量的++递增,然后一些变量在变量之后有++.这些有什么区别?这是我试图解释m和y变量的一个例子.

 switch(f){
        case 0:{

            ++m;
            if(m==12){
                m=0;
                y++;
            }
            break;
        }
        case 1:{

            --m;
            if(m==-1){
                m=11;
                y--;
            }
            break;
        }
        case 2:{

            ++y;
            break;
        }
        case 3:{

            --y;
            break;
        }
        case 4:{

            break;
        }
        }
Run Code Online (Sandbox Code Playgroud)

javascript

14
推荐指数
2
解决办法
9464
查看次数

document.writeln不会写入新行

我只是写了一些简单的代码,我注意到使用document.writeln没有写入新行,允许我演示...

    // this is my JSON object
var myObject = {
 "firstName": "John",
 "lastName": "Smith",
 "age": 25,
 "address": [{
    "Address1": "11 My Street",
    "Address2" : "Nice Area",
    "Town" : "Nice Town",
    "PCode" : "P05T 0DE"
    }]
 }

document.writeln(myObject.firstName);
document.writeln(myObject.address[0].Address1);
Run Code Online (Sandbox Code Playgroud)

现在这输出以下....

John 11 My Street

这一切都在一条线上?如果我使用document.write()我会期待这个吗?它发生在IE和Firefox中.显然我可以添加+ "<br/>"+ "\n"但我不应该这样做?

我是傻瓜吗?

javascript

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

从代码隐藏文件中的HTML元素中删除CSS类

我的界面/ webform上有以下内容:

<div id="mydiv" class="forceHeight" runat="server" />
Run Code Online (Sandbox Code Playgroud)

现在我的代码中有一个条件,如果某种情况属实,我需要forceHeight从该控件中删除该类.我知道在C#中你可以使用:

mydiv.CssClass.Replace("forceHeight", ""); 
Run Code Online (Sandbox Code Playgroud)

我不太确定你是怎么用VB做的?Intellisense不提供这个选项吗?

任何人的想法?

vb.net asp.net

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

循环遍历AngularJS指令中元素的子元素

我有一个问题 - 我忘记了如何编码!我有一个angularJS指令,它位于父包装器标签(DIV)上,在我的指令中我想循环遍历子节点(第一个子DIV).我有以下内容

<div data-check-attributes>
  <div data-ng-repeat="user in Users" data-id="{{ user.ID }}" data-ng-click="doSomething(user.ID)" data-new="{{ user.newUser }}" class="">
    <div> {{ user.userName }} </div>
    <div> {{ user.userAge }} </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

现在在我的指令中我想循环遍历第一个子div(可能有很多这些,但我在加载的视图中看到10个用户)并在我的指令中执行某些检查和修改,使用数据属性,$ location对象和可能还有更多...但是我不记得如何遍历第一个子div,我似乎得到了我尝试过的所有错误...到目前为止我有这个,这不起作用!在下面的示例中,我只想将第一个子节点的data-id写入控制台

.directive('checkAttributes', function ($location) {
        return{
            restrict: 'A',
            link: function (scope, element) {

            // will use $location later

                console.log(angular.element(element)[0]);  // this outputs the HTML
                console.log(angular.element(element)[0].children().length); // this errors, TypeError: object is not a function

                for (var i = 0; i < angular.element(element)[0].children.length; i++) {
                    console.log(angular.element(element)[0].children[i].getAttribute('data-id'));
                }

            }
        };
    });
Run Code Online (Sandbox Code Playgroud)

我很困惑......请帮忙!

javascript angularjs

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

如何在AngularJS指令中获取元素的x和y位置

在指令的link函数部分中,我们可以访问该element对象.我想确定element对象是否在当前视口中/是否可用.

我目前有以下内容:

link: function (scope, element, attrs, controller) {


                var page = angular.element(window);
                page.bind('scroll', function () {
                   var windowScroll = page[0].pageYOffset,
                       windowHeight = page[0].innerHeight;
                       // elementScroll = element.xpos; - this is undefined?
                       // elementScroll = element.getBoundingClientRect().top - this does not work... undefined?

                       // elementScroll = element[0].getBoundingClientRect().top - this does not work... undefined?
                       // ... logic follows that if elementScroll is between windowScroll & windowScroll + windowHeight it is visible!

                });
Run Code Online (Sandbox Code Playgroud)

我似乎无法获得我的特定元素的x和y位置(该指令可能会重复多次).

请注意,我不打算在我的应用程序中安装或使用jQuery.

javascript angularjs

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

如何用Angular2和Reactive听一下css动画师的结尾

我想在我的Angular2应用程序中手动执行页面转换.所以我到目前为止所做的是产生了一个服务,我从一个处理导航的组件调用.当您单击某个链接,图标或我称之为AnimationService goTo方法的任何内容时.这将接收一个URL并推送到Observable流/主题.这是迄今为止的服务:

@Injectable()
export class AnimationService {
    // should you be a directive?
    animationStream: Subject<string> = new Subject<string>();
    animationStreamEnd:Subject<string> = new Subject<string>()

    constructor() {

        // this is to listen for when it is time to navigate to whereever? 
        this.animationStreamEnd.subscribe(resp => {
            // redirect the url / app here
            this.router.go(resp);
        });

    }

    goTo(url:string): void {
        // so, broadcast down to trigger the css animation...
        this.animationStream.next(url);
    }

}
Run Code Online (Sandbox Code Playgroud)

我希望动画的内容ngClass在它的HTML模板中有一个条件,就像这样[ngClass]="{'animate-left': applyTransitionClass}",它看起来像这样

<div class="gridClass" [ngClass]="{'animate-left': applyTransitionClass}">
    <div class="gridRow">
        <route-view></route-view> …
Run Code Online (Sandbox Code Playgroud)

reactive-programming css-animations typescript angular

9
推荐指数
2
解决办法
4500
查看次数

Javascript中MM/DD/YYYY的正则表达式

我刚刚在javaScript中编写了这个正则表达式,但它似乎不起作用,这是我的函数:

function isGoodDate(dt){
    var reGoodDate = new RegExp("/^((0?[1-9]|1[012])[- /.](0?[1-9]|[12][0-9]|3[01])[- /.](19|20)?[0-9]{2})*$/");
    return reGoodDate.test(dt);
}
Run Code Online (Sandbox Code Playgroud)

这就是我在表单验证中调用它的方式

if(!isGoodDate(userInput[1].value)){
           alert("date not in correct format of MM/dd/YYYY");
           return false;  
        }
Run Code Online (Sandbox Code Playgroud)

现在我希望它返回MM/DD/YYYY但是如果我在其中放置一个有效的日期会引发警报?任何人的想法?

javascript regex

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

Javascript/jQuery追加到FormData()返回'undefined'

我正在尝试使用jQuery进行简单的文件上传.我的HTML中有一个文件输入,如下所示:

<form id="PhotoUploadForm" action="/some/correct/url" method="post" enctype="multipart/form-data">
            <input type="file" id="uploadPhoto" accept="image">
</form>
Run Code Online (Sandbox Code Playgroud)

我还有一些JavaScript/jQuery绑定到输入的change事件,如下所示:

   $('#uploadPhoto').on("change", function (event) {

        var fileData = this.files[0];
        var data = new FormData();
        data.append('image',fileData);
        data.append('content','What could go wrong');
        console.log(data.image, data.content); // this outputs 'undefined undefined' in the console

        $.ajax ({
            url: "/some/correct/url",
            type: 'POST',
            data: data,
            processData: false,
            beforeSend: function() {
               console.log('about to send');
            },
            success: function ( response ) {                   
                console.log( 'now do something!' )
            },
            error: function ( response ) {
                console.log("response failed");
            }
        });
    }); …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery

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