watch函数里面的指令没有触发

时间:2017-03-12 07:10:34

标签: javascript angularjs

我的角度指令如下:

angular
    .module('accountApp')
    .directive('matchTo', function() {
        return {
            restrict: 'A',
            require: 'ngModel',
            link: function(scope, elm, attrs, ctrl) {

                // var attributes = scope.$eval(attrs.matchTo);

                ctrl.$validators.matchTo = function(modelValue) {

                    var attributes = scope.$eval(attrs.matchTo);

                    if(attributes.unequal == undefined) {
                        attributes.unequal = false;
                    }

                    console.log(modelValue);
                    console.log(attributes.matchString);
                    console.log(attributes.unequal);

                    if(attributes.unequal) {
                        if(attributes.matchString == undefined || attributes.matchString == null) {
                            return true;
                        } else {
                            return modelValue != attributes.matchString;
                        }
                    } else {
                        if(attributes.matchString == undefined || attributes.matchString == null) {
                            return false;
                        } else {
                            return modelValue == attributes.matchString;
                        }                        
                    }
                }

                scope.$watch(attrs.matchString, function() {
                    ctrl.$validate();
                    console.log('watch fired');
                });

            }
        }
    });

这是我的HTML:

<input type="text" id="name" name="name" class="form-control form-input" ng-model="creditDebit.name"
        ng-disabled="isReadOnly" autocomplete="off"
        required 
        ng-required-err-type="requiredCreditDebit" />

<input type="text" id="code" name="code" class="form-control form-input" ng-model="creditDebit.code"
        ng-disabled="isReadOnly" autocomplete="off"
        required 
        match-to="{ matchString: creditDebit.name, unequal: true}"
        ng-required-err-type="requiredCreditDebitCode"
        ng-matchTo-err-type="unMatchNameAndCode" />

仅在重新加载页面时才会触发监视功能。但我希望它会在价值变化时触发。

2 个答案:

答案 0 :(得分:1)

你可以使用。

scope.$watch(attrs.matchString, function() {
                ctrl.$validate();
                console.log('watch fired');
   },true);

或立即尝试

element.bind('keypress', function(event) {
              if(event.keyCode === 32) {
                event.preventDefault();
              }
            });

答案 1 :(得分:1)

不需要观察属性,因为它不是更改的属性,而是范围上的this.options[this.selectedIndex].text属性。所以我会这样做:

declare namespace ms = "http://schemas.openxmlformats.org/spreadsheetml/2006/main" ;
declare namespace ns2 = "http://www.example.com/";

declare function local:AgentReport() 
{ 
<AgentReport>
    <Report>
        <GroupNumber>1</GroupNumber>
        <Quotes>1</Quotes>
        <Converted>1</Converted>
        <Conv_Rate>1</Conv_Rate>
    </Report>
    <Report>
        <GroupNumber>2</GroupNumber>
        <Quotes>2</Quotes>
        <Converted>2</Converted>
        <Conv_Rate>2</Conv_Rate>
    </Report>
</AgentReport>
};
declare function local:getRows( $x ) as element(ms:row)* 
{ 
    let $first-row :=
            <ms:row> 
            {
            for $i in $x/*/*[1]/child::element()
            return 
            <ms:c t="inlineStr"> <ms:is> <ms:t>{fn:node-name($i)}</ms:t> </ms:is> </ms:c> 
            }
            </ms:row>
    return 
        (
        $first-row,

        for $each in $x//Report
        return
        <ms:row> 
        {
        for $i in $each/*
        return 
        <ms:c t="inlineStr"> <ms:is> <ms:t>{$i/string()}</ms:t> </ms:is> </ms:c> 
        }
        </ms:row>
        )
};

declare function local:generate-simple-xl-ooxml( $content-types as node(), $workbook as node(), $rels as node(), $workbookrels as node(), $sheet1 as node() ) as binary() 
{ 
    let $manifest :=    <parts xmlns="xdmp:zip"> 
                        <part>[Content_Types].xml</part> 
                        <part>workbook.xml</part> 
                        <part>_rels/.rels</part> 
                        <part>_rels/workbook.xml.rels</part> 
                        <part>sheet1.xml</part> 
                        </parts> 
    let $parts := ($content-types, $workbook, $rels, $workbookrels, $sheet1) 
    return xdmp:zip-create($manifest, $parts)
};

let $content-types := <Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types"> 
                      <Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/>
                      <Default Extension="xml" ContentType="application/xml"/> 
                      <Override PartName="/workbook.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet.main+xml"/> 
                      <Override PartName="/sheet1.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.worksheet+xml"/> 
                      </Types> 

let $workbook :=  <workbook xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main" xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships"> 
                  <sheets> 
                  <sheet name="Sheet1" sheetId="1" r:id="rId1" /> 
                  </sheets> 
                  </workbook> 

let $rels :=  <Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"> 
              <Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument" Target="workbook.xml"/> 
              </Relationships> 

let $workbookrels :=  <Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"> 
                      <Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/worksheet" Target="sheet1.xml"/> 
                      </Relationships> 

let $date := xs:string(fn:current-date())

let $day := fn:tokenize($date, "\+")[1]

let $xml := local:AgentReport()

let $page := xdmp:tidy(xdmp:quote($xml), 
                      <options xmlns="xdmp:tidy">
                      <input-xml>true</input-xml>
                      </options>)[2]

let $tables := $page

let $sheet1 :=   <worksheet xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main"> 
                <sheetData> {local:getRows($tables)} </sheetData> 
                </worksheet> 

let $package := local:generate-simple-xl-ooxml($content-types, $workbook, $rels, $workbookrels, $sheet1) 

let $filename := "ExcelTest.xlsx" 

let $disposition := concat("attachment; filename=""",$filename,"""") 

let $x := xdmp:add-response-header("Content-Disposition", $disposition) 

let $x := xdmp:set-response-content-type("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet") 

let $insertReport := xdmp:document-insert(concat("/GroupNumberReport/Group-", $day, ".xlsx"), $package, (), "GroupReport")

let $saveReport := xdmp:save(concat("C:\EriePoc\DataStage-Demo\Report\Group-", $day, ".xlsx"), $package)

return fn:true()

有关详细信息,请参阅this plunker