javascript - 从 AngularJS Controller 调用 Javascript 函数

Question

我仍在学习将 jquery 调用转换为 Angular js。 我之前使用 ziplookup 构建了一个用于 zip 查找的网页。

为此我必须添加:

<script src="http://ziplookup.googlecode.com/git/public/ziplookup/zipLookup.min.js" type="text/javascript">
</script>

和

$(document).ready(function() {                                  // When the document loads,

            $.zipLookupSettings.libDirPath = 'ziplookup/'               // (Optionally) set the library folder path manually

            $('[name=zipcode]').blur(function(){                        // Set on blur
                $.zipLookup(                                            // Do a Zip code Lookup
                    $(this).val(),                                      // Zip code Field Value
                    function(cityName, stateName, stateShortName){      // If Successful,
                        $('input[name=city]').val(cityName);            // Set City name
                        $('input[name=state_short]').val(stateName);    // Set State abbreviation
                        $('input[name=state]').val(stateShortName);     // Set State name
                        $('.message').html("Found Zipcode");            // Add a message
                    },
                    function(errMsg){                                   // If Zip couldn't be found,
                        $('.message').html("Error: " + errMsg);         // Add an error message
                    });
            });
        });

现在我希望将其移植到 Angular js 中。 我不是在模糊事件上调用 zipLookup 函数，而是通过按下按钮来调用它。并设置相同的参数，但它给出: ReferenceError:zipLookupSettings 未定义 或 ReferenceError:zipLookup 未定义

$scope.zipeval = function(){
     //zipLookupSettings.libDirPath = 'ziplookup/';
    zipLookup(                                            // Do a Zip code Lookup
        11722,                                      // Zip code Field Value
        function(cityName, stateName, stateShortName){      // If Successful,
            $log.log(cityName + stateName + stateShortName);
            //$('input[name=city]').val(cityName);            // Set City name
            //$('input[name=state_short]').val(stateName);    // Set State abbreviation
            //$('input[name=state]').val(stateShortName);     // Set State name
            //$('.message').html("Found Zipcode");            // Add a message
        },
        function(errMsg){                                   // If Zip couldn't be found,
            $log.log("error");       // Add an error message
        });
};

请指导。我需要创建一个指令吗？

Answer 1

这里您将其作为本地函数调用。

您应该将其命名为 $.zipLookup。

在 HTML 中，您可以添加一个指令。

 <input name="zipcode" custDirective></input>

在指令的链接函数中，您可以绑定(bind)到“模糊”或“点击”等事件。在那里你可以调用 $.zipLookup()