Question

我想检查从客户端发送的字体和fontSize是否未定义。当用户不选择字体或字体大小时，它会传递值undefined。当只有其中一个（字体或字体大小）未定义时，这些条件很有效，但当两个都未定义时，我收到错误，

TypeError: Cannot read property 'font' of undefined
    at Scope.StylesCtrl.$scope.addStyles (http://0.0.0.0:8080/app/edit/styles/StylesCtrl.js:26:38)
    at fn (eval at <anonymous> (http://0.0.0.0:8080/bower_components/angular/angular.js:13231:15), <anonymous>:4:317)
    at ngEventDirectives.(anonymous function).compile.element.on.callback (http://0.0.0.0:8080/bower_components/angular/angular.js:23411:17)
    at Scope.$get.Scope.$eval (http://0.0.0.0:8080/bower_components/angular/angular.js:15916:28)
    at Scope.$get.Scope.$apply (http://0.0.0.0:8080/bower_components/angular/angular.js:16016:25)
    at HTMLInputElement.<anonymous> (http://0.0.0.0:8080/bower_components/angular/angular.js:23416:23)
    at HTMLInputElement.jQuery.event.dispatch (http://0.0.0.0:8080/bower_components/jquery/dist/jquery.js:4435:9)
    at HTMLInputElement.jQuery.event.add.elemData.handle (http://0.0.0.0:8080/bower_components/jquery/dist/jquery.js:4121:28) undefined

以下是服务器端的if else条件，

if(font == undefined && fontSize == undefined){ //doesn't work
        console.log("font");
        updateFile(main, [
            {rule: ".made-easy-themeColor", target: "color", replacer: color}
        ], function (err) {
            console.log((err));
        });
    }

    else if(font == undefined){ //work well
        updateFile(main, [
            {rule: ".made-easy-themeColor", target: "color", replacer: color},
            {rule: ".made-easy-themeFontSize", target: "font-size", replacer: fontSize + "em"}
        ], function (err) {
            console.log((err));
        });
    }
    else if(fontSize == undefined){ //work well
        updateFile(main, [
            {rule: ".made-easy-themeColor", target: "color", replacer: color},
            {rule: ".made-easy-themeFont", target: "font-family", replacer: font}
        ], function (err) {
            console.log((err));
        });
    }

    else{ //work well
        updateFile(main, [
            {rule: ".made-easy-themeColor", target: "color", replacer: color},
            {rule: ".made-easy-themeFont", target: "font-family", replacer: font},
            {rule: ".made-easy-themeFontSize", target: "font-size", replacer: fontSize + "em"}
        ], function (err) {
            console.log((err));
        });

    }

这是前端的HTML代码

 <h3 ng-style="{'font-family': styles.textSize.font, 'font-size': styles.textSize.size + 'px'}">Text Is</h3>

这是将数据发送到服务器的控制器

$scope.addStyles = function(styles) {
            $scope.fontdata = {
                appId: "55c0ace94aa248735d75b140",
                header: styles.uploadme,
                color: styles.myColor,
                font: styles.textSize.font,
                fontSize: styles.textSize.size
            };
                stylesService.editStyles($scope.fontdata)
                    .success(function (res) {
                        console.log("success");
                    })
        };

我的if else语句有问题吗？或者是因为我正在比较字符串值（字体）和int值（fontSize）？

Answer 1

堆栈清楚地表明错误位于以下位置的StyleCntrl.js中在Scope.StylesCtrl。$ scope。 addStyles （http://0.0.0.0:8080/app/edit/styles/ StylesCtrl.js：26：38）

并且它适用于addStyles函数中的下面一行 font：styles.textSize.font

问题是因为样式对象中的 textSize 是未定义的，如果您尝试读取未定义对象上的任何属性，则java脚本将始终抛出错误

TypeError：无法读取未定义的属性

Answer 2

问题可能是您没有在$scope上初始化模型对象。它与你的服务器端无关，如果/其他......正如@Hrishi指出的那样，这是一个Javascript错误：）

要解决此问题，您需要初始化范围内的对象styles.textSize。

原因是当用户键入其中一个输入时，Angular（ng-model？）会为您创建此对象。但是当用户没有输入任何内容时，styles.textSize永远不会被定义。

在这里猜测，b / c我们无法在你的控制器中看到你的模板或其他代码，但修复它会做这样的事情：

$scope.styles = { textSize: { } };

if else条件在angularjs中比较字符串和int值

2 个答案: